vue项目中遇到的难点

  1. input中type为number时 max-length 失效

    解决:input type="tel"

  2. vue组件中click事件失效

    解决:使用了bette-scroll插件做滚动。加.native也不好使,发现better-scroll的配置中没有设置 click:true,设置过之后click事件成功。

  3. 不同商品页,id变化,商品不变

    监听$route变化,然后获取id重新去取数据。

  4. 修改完数据点击提交后,数据变了 页面数据没有更新

    原因:因为vue的检查机制在进行视图更新时无法监测 数组中的某个对象的属性值的变化。(数据是引用数据类型,数据上没有get set方法)

    方案一:利用 this.set(this.obj,key,val)

    解析:第一个参数目标对象,第二个参数要修改数据下标,第三个参数修改后的新值。

    方案二:也可以使用$nextTick()这个方法

    扫描二维码关注公众号,回复: 13164378 查看本文章

    解析:在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM,

    Vue 在更新 DOM时是异步执行的。当数据发生变化,Vue将开启一个异步更新队列,视图需要等队列中所有数据变化完成之后,再统一进行更新!

    方案三:this.$forceUpdate(); //可以直接使用这个是强制更新 但不推荐使用

    调用强制更新方法this.$forceUpdate()会更新视图和数据,触发updated生命周期。

猜你喜欢

转载自blog.csdn.net/Frazier1995/article/details/120087197