vue3的computed计算属性传参
在使用计算属性时,尤其是有v-for和slot插槽的使用时,进行一些参数的传递。
1. 在v-for中使用计算属性传参。
<div v-for="item in list"> <div v-if='isShow(item)'>是否显示</div> </div> <script> import {computed} from 'vue' const currentId=ref(null) const isShow=computed(()=>(item:any)=>{ //计算属性传递参数 return currentId=== item.id }) </script>
2. 在slot插槽中计算属性传参。
<ss-vue-calendar> <template #tbodyCell="scope"> <span v-if="getCurrentDayDetailed(scope.item)"> {{getCurrentDayDetailed(scope.item)}} </span> </template> </ss-vue-calendar> <script lang='ts'> const getCurrentDayDetailed = computed(() => (item: any) => { return item.id==='123' }) </script>