<uni-section title="使用插槽" type="line">
<uni-list border-full>
<uni-list-item>
<view class="slot-box">
<view class="slot-content">
<text class="slot-text">默认插槽</text>
</view>
<uni-badge text="2" type="primary" />
</view>
</uni-list-item>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template v-slot:actions>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template>
</uni-list-item>
</uni-list>
</uni-section>
FQCloud
- 发布：2022-03-31 09:20
- 更新：2022-03-31 13:49
- 阅读：1653
产品分类： uniapp/H5
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： macOS 12.2.1 (21D62)
HBuilderX类型： 正式
HBuilderX版本号： 3.3.13
浏览器平台： Chrome
浏览器版本： 版本 99.0.4844.83（正式版本） (x86_64)
项目创建方式： HBuilderX
操作步骤：
预期结果：
<uni-section title="使用插槽" type="line">
<uni-list border-full>
<uni-list-item>
<view class="slot-box">
<view class="slot-content">
<text class="slot-text">默认插槽</text>
</view>
<uni-badge text="2" type="primary" />
</view>
</uni-list-item>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template v-slot:actions>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template>
</uni-list-item>
</uni-list>
</uni-section>
<uni-section title="使用插槽" type="line">
<uni-list border-full>
<uni-list-item>
<view class="slot-box">
<view class="slot-content">
<text class="slot-text">默认插槽</text>
</view>
<uni-badge text="2" type="primary" />
</view>
</uni-list-item>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template v-slot:actions>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template>
</uni-list-item>
</uni-list>
</uni-section>
实际结果：
<uni-section title="使用插槽" type="line">
<uni-list border-full>
<uni-list-item>
<view class="slot-box">
<view class="slot-content">
<text class="slot-text">默认插槽</text>
</view>
<uni-badge text="2" type="primary" />
</view>
</uni-list-item>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template v-slot:actions>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template>
</uni-list-item>
</uni-list>
</uni-section>
<uni-section title="使用插槽" type="line">
<uni-list border-full>
<uni-list-item>
<view class="slot-box">
<view class="slot-content">
<text class="slot-text">默认插槽</text>
</view>
<uni-badge text="2" type="primary" />
</view>
</uni-list-item>
<uni-list-item title="自定义右侧插槽" note="列表描述信息" link>
<template v-slot:actions>
<image class="slot-image" src="/static/logo.png" mode="widthFix"></image>
</template>
</uni-list-item>
</uni-list>
</uni-section>
bug描述：
uni-list-item slot插槽失效了，官方案例也看不到插槽
FQCloud (作者) - 三好学生
<uni-list>
<uni-list-item>
<!-- 自定义 header -->
<view slot="header" class="slot-box">自定义 header</view>
<!-- 自定义 body -->
<text slot="body" class="slot-box slot-text">自定义插槽body</text>
<!-- 自定义 footer-->
<template slot="footer">
<text>自定义 footer</text>
</template>
</uni-list-item>
</uni-list> 
Vue3 slot 很多问题（在微信小程序中），希望尽快修复更新！
修改数据后（测试的时候是列表数据），slot经常不刷新或者刷新慢。
uni_modules中的模块里改变数据，有时候根本不刷新slot的界面。
在调用module的页面中改变module的数据，对应的slot有时候刷新，有时候不刷新。
多重嵌套的slot不能正常显示等问题。
FQCloud (作者)
我刚导入的不行，然后看了官网的案例和UI展示，也看不到插槽，我上面的截图就是在你们官网截得
2022-03-31 13:22
FQCloud (作者)
微信小程序，我测了一下，vue2是可以的，我用的是vue3就不行了
2022-03-31 13:31
FQCloud (作者)
首先感谢你们的专业和敬业，那么我怎么修复？等待你们上传新的uni-ui版本是吗
2022-04-01 14:14