Vant中插槽的使用
Vant 提供了丰富的组件插槽,通过插槽可以对组件的某一部分进行个性化定制。
例如,我们希望对组件cell在输出内容前加上图标,原代码为:
<van-cell v-for="item in formEntryList.list" :key="item.id" @click="goApplyForm(item.pageCode)" :title="item.workName" > </van-cell>
使用插槽后,为
<van-cell v-for="item in formEntryList.list" :key="item.id" @click="goApplyForm(item.pageCode)" > <template #default> <van-icon name="edit" /> <span>{{ item.workName }}</span> </template> </van-cell>
即可加入图标。