计算属性
1 定义： 要用的属性不存在，要通过已有的属性计算得来
2 原理： 底层借助了Object.defineproperty()方法提供的getter和setter。
3 get函数什么时候执行
(1) 初次读取时会执行一次
(2)当依赖的数据发生改变时会被再次调用
4 优势：与methods相比。内部有缓存机制，效率更高，调试方便
5 计算属性最终会出现在vm中，直接读取使用即可
如果计算属性要被修改，那必须写set函数去响应修改，且set中要引起计算时依赖的数据发生改变
简写：函数
Vue3中
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| setup(){
//计算属性简写
let fullName=computed(()=>{
return person.firstName+"-"+person.lastName
})
//计算属性完整
let fullName=comouted({
get(){
return person.firstName+"-"+person.lastName
}
set(val){
const nameArr=value.split("-")
person.firstName=nameArr[0]
person.lastName=nameArr[1]
}
})
}
|