vue3的computed计算属性返回值注解

//语法结构:computed<返回值的类型>()
列子
复制代码
//定义数据
const cuont = ref(0)
type Item = {
  id: string
  name: string
  price: number
}
const list = ref<Item[]>(
[{ id: '1001', name: '男鞋', price: 888 },
{ id: '1002', name: '女鞋', price: 777 },
{ id: '1003', name: '中性鞋', price: 333 }]
)
//第一种写法 计算属性 自己默认 const dobuleCount = computed(() => { cuont.value * 2 }) dobuleCount //第二种 自己定义类型返回值注解 const filterGood = computed<Item[]>(() => { return list.value.filter(item => item.price > 500) }) </script> <template> <ul> <li v-for="item in filterGood" :Key="item.id"> {{ item.name }} </li> </ul> </template> <style scoped></style>
复制代码

 

 
posted @   light丶  阅读(209)  评论(0编辑  收藏  举报
点击右上角即可分享
微信分享提示