极客观点
项目管理
HarmonyOS
computed.set为什么无法执行？
完整代码如下：
<!doctype html>
<html lang="en">
<head>
<script src="https://cdn.bootcdn.net/ajax/libs/vue/3.0.7/vue.global.prod.js"></script>
<title>Document</title>
</head>
<body>
<div id="app">
<template v-for="v in newList">
<div><input type="text" v-model="v.val"></div>
</template>
</div>
<script>
const data = {
data() {
return {
list: [{val:'A1'}, {val:'B1'}, {val:'C1'}]
}
},
computed: {
newList: {
get(){
return [{val:'A'}, {val:'B'}, {val:'C'}];
},
set(v){
console.log(v);
this.list[0].val='ddd';
}
}
}
};
Vue.createApp(data).mount('#app');
</script>
</body>
</html>
问题出在这行
this.list[0].val='ddd';这一行是无法被
vue所监听到的，需要使用this.$set函数来设置，具体参考Vue.set函数的使用。