vue3 computed
来源：5-18 播放器 mini 播放器开发（03）
qq_再见了我的青春_0
2023-04-02
const arr = [{a:1,b:2}, {a:2, b:3}];
const num = computed(() => {
let a = 0;
arr.forEach(item => {
a+=item.a
}
})
当arr的a发生变化时，num不会重新渲染，我就想用computed来搞，请问老师有啥好方法吗，一下没想到，
我试过用arr = [...arr]但还是不行
写回答
1回答
-
weibo_啊喂丶你能勤快点么_0
2023-04-19
先说下你的表述问题：
首先 computed是需要返回值的
第二 刚开始不是很明白，你想做什么，仔细看了之后，推测你是想监测arr ，然后动态求和
然后我说下我的想法：想要监测arr，我觉得首先要reactive数组，然后求sum的话，优先用reduce，之后模拟数组的变化，注意必须在template那边写sum，这样computed才会执行，试试
const arr = reactive([{a:1,b:2}, {a:2, b:3}]); const sum = computed(()=> arr.reduce((acc,cur)=>{return acc + cur.a},0) ) setTimeout(()=>{ arr[0].a = 3; },3000)如果并不想在dom中显示，只是纯粹想监听的话，建议用watch，这边注意需要的deep，如果最开始就需要的话，还需要加immediate
const sum2 = ref(0); watch( arr, (newValue) => { sum2.value = newValue.reduce((acc, cur) => { return acc + cur.a; }, 0); }, { deep: true }, ); setTimeout(() => { arr[0].a = 3; }, 3000);01
相似问题