computed中get和set方法

getter

getter方法,用于返回当前computed属性的属性值

一般使用普通函数来作为回调函数

<script>
export default {
...
computed: {
// 获取全选状态
// 函数写法 ,简单写法 默认:只执行一次getter计算
chooseAll :function () {
return this.list.every(item => item.goods_checked === true)
}
}
}
</script>

如果使用箭头函数,会改变this指向,因为计算属性得到的结果一般都是通过对一些其他数据进行操作后得到的结果,所以如果改变this指向,在取值时会有很大麻烦

<script>
export default {
...
computed: {
chooseAll : () =>{
console.log(this); // undefined
return this.list.every(item => item.goods_checked === true)
}
}
}
</script>

setter

setter方法,用于对计算属性所得到的结果进行操作,计算属性默认只有getter,不过在需要时你也可以提供一个setter

setter方法的回调函数,我们也选择用普通函数(理由同上)

setter方法的回调函数中会返回一个参数,是我们getter方法得出的结果

<script>
export default {
...
computed: {
// 对象写法,完整写法 setting, 适用于可以进行数据双向绑定(v-model)的组件或标签(input,textarea)
chooseAll: {
get () {
return this.list.every(item => item.goods_checked === true)
},
set (newval) {
console.log(newval)
this.list.forEarch(item => item.goods_checked = newval)
}
}
}
}
</script>

注意:完整写法中 setting, 适用于可以进行数据双向绑定(v-model)的组件或标签(input,textarea)

posted @   丫丫learning  阅读(4631)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
· 上周热点回顾(2.17-2.23)
点击右上角即可分享
微信分享提示