这个是一个vue 中 computed 的一个小问题
解决方案是通过提issue 解决的,issue链接
Vue.js version
1.0.26
实例
代码部分
<div id="app">
<div class="hello">
<h1 @click="add()">添加</h1> {{ goods | json }}
<br/> {{ result }}
</div>
</div>
new Vue({
el: '#app',
data: {
goods: [],
},
methods: {
add() {
const good = {
number: 1
};
this.goods.push(good);
console.log(this.goods);
}
},
computed: {
// 一个计算属性的 getter
result: function() {
let number = 0;
for (let i in this.goods) {
number += this.goods[i].number;
}
return number;
}
}
})
关键的部分是在
// 一个计算属性的 getter
result: function() {
let number = 0;
for (let i in this.goods) {
number += this.goods[i].number;
}
return number;
}
采用这样的计算方式在特定的手机上是有问题的,
测试结果
左边是 ios 9.3.4 iphone 6 plus
右边是 我的小米手机
有问题的设备
ios 9.3.3 and 9.3.4 iphone 6s plus or iphone 5s
没问题的设备
ios 8.2 iphone 6 ,some android phone,PC chrome
解决方案
改变一下写法就可以了
result: function() {
return this.goods.reduce((sum, good) => sum + good.number, 0)
}
具体是因为什么造成的可能涉及的比较多,我就暂时不去探讨了。
另外在写js 的时候最好遵守 airbnb 规则,可以更好的避免出现问题