用过vue2的都知道,computed是计算属性,vue3也是计算属性,只不过使用之前得从vue身上引用。
本文说说vue3的compued两种写法和区别
1、参数为函数
import { computed } from 'vue'
let brand = ref('huawei')
let model = ref('p40')
//不能修改myPhone
let myPhone = computed(() => {
return brand.value + '-' + model.value
})
2、参数为对象
import { computed } from 'vue'
let brand = ref('huawei')
let model = ref('p40')
//可以修改myPhone.value = 'huawei-p60'
let myPhone = computed({
get(){
return brand.value + '-' + model.value
},
set(val){
const [s1, s2] = val.split('-')
brand.value = s1
model.value = s2
}
})
myPhone.value = 'huawei-p60'
总结:参数为函数是只读的计算属性,参数为对象可读可写。