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>
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步