WeChat Mini Program Documentation - Introduction to slots
Judging from the above documents, the official WeChat applet does not mention the content of dynamic slots.
uniapp documentation - slots introduction
The uni official also did not mention the content about dynamic slots
In actual use, an error will be reported directly through the form of <<slot :name="item.xxx" />,
I searched a lot of information on the Internet and found that it can only be compiled by condition
The following is the code compatible with WeChat applet and h5:
Define components:
<!-- HACK: uni-app 处理动态 slot 名字不兼容,需要使用不同的语法 -->
<!-- #ifdef H5 -->
<slot :name="`tab:${item.key}`"></slot>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN-->
<slot name="tab:{
{item.key}}"></slot>
<!-- #endif -->
Use components:
<view>
<!-- HACK: uni-app 处理动态 slot 名字不兼容,需要使用不同的语法 -->
<!-- #ifdef H5 -->
<template v-for="item in list" :slot="`tab:${item.id}`">
<post-list :key="item.id" />
</template>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN-->
<template v-for="item in lits" slot="tab:professional:{
{item.id}}">
<post-list :key="item.id" />
</template>
<!-- #endif -->
</view>
The above solution comes from the information: Dynamic slot name discussion and HACK solution - DCloud Q&A