Vue computed 计算属性
Vue About 753 words含义
计算属性是为了方便代码服用,如拼接相关属性后生成的一个新的值,需要被多处地方使用,就可以使用计算属性这个功能来生成新字段避免重复代码。
computed
属性下定义需要计算的属性函数,此函数名会被生成为Vue
对象vm
的属性。
如下所示:computed
计算属性userInfo
函数会返回username
、age
、gender
拼接后的新字符串,Vue
会生成一个userInfo
的属性,挂载在Vue
对象上。
完整代码
<div id="app">
{{ userInfo }}
</div>
<script>
const vm = new Vue({
el: "#app",
data: {
username: "张三",
age: 18,
gender: "男"
},
computed: {
userInfo() {
return `${this.username} - ${this.age} - ${this.gender}`;
}
},
methods: {
getInfo() {
console.log(this.userInfo);
}
}
});
console.log(vm)
console.log(vm.userInfo)
</script>
Views: 764 · Posted: 2023-01-03
————        END        ————
Give me a Star, Thanks:)
https://github.com/fendoudebb/LiteNote扫描下方二维码关注公众号和小程序↓↓↓
Loading...