小程序
小游戏
企业微信
微信支付
扫描小程序码分享
在小程序的组件中定义如下：
<
view
>
slot
name
=
"a"
></
"b"
</
使用时
component-test
>test</
该怎么判断slot a是否存在呢？（不存在的元素做隐藏）
11 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
确认一下，你的需求是，component-test 组件需要能够判断自己的某个 slot 中是否实际存在节点？
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
我们考虑一下添加这个特性。
不过，限于小程序的架构，即使添加这个特性，接口只能做成异步的（类似于 wx.createSelectorQuery）。
你好，目前没有相关特性支持。可否描述一下你的使用场景呢？我们会考虑添加这个特性。
应用场景举例：
判断是否传入 <slot name="a"></slot>，若传入，则显示该slot内容，否则，显示一个默认的view内容
view 和 slot 是否在同一个位置上呢？
是的。
就好像显示商品的图片，如果有配置则显示配置的图片（slot传入），如果没用的话显示一个默认的图片（静态固定的）。
显示位置、效果等都是一样的，区别仅在于参数
刚刚发现可以用 :empty 伪类来找到这个节点，然后把节点给隐藏起来
方案:
如下,当没有内容时,显示空图标
wxml:
<view class="container" > <view class="page-header"><slot name="header" /></view> <view class="page-body"> <view class="page-content"><slot /></view> <empty class="empty" text="{{emptyText}}" icon="{{emptyIcon}}" /> </view> </view>
wxss:
.empty{ visibility:hidden } .page-content:empty + .empty{ visibility:visible; }
类似vue会提供this.$slots['name']用于判断。
功能场景就是上面我写的，实现一个多slot组件，当复杂度较高时可以通过判断slot是否存在来控制组件展示样式
<view a:if="{{$slots.$default}}" class="am-input-label {{labelCls}}">
<slot />
</view>
slot能否放到js变量里 需要<component><sub data-id="1">标题1</sub><sub data-id="2">标题2</sub></component> 获取中间的拼接成二维数组 在组件里使用 这样代码比较直观 不然只能写成<sub data-id="1" data-title="标题1" />
支付宝小程序上可以这么做 微信上失效了
查了一下，并没有相关的 api。
业务情况是需要先根据是否提供了 slot 再决定如何渲染。
虽然没实现过，不过现在已经有相关的api了
正在加载...
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
确认一下，你的需求是，component-test 组件需要能够判断自己的某个 slot 中是否实际存在节点？
我们考虑一下添加这个特性。
不过，限于小程序的架构，即使添加这个特性，接口只能做成异步的（类似于 wx.createSelectorQuery）。
你好，目前没有相关特性支持。可否描述一下你的使用场景呢？我们会考虑添加这个特性。
应用场景举例：
判断是否传入 <slot name="a"></slot>，若传入，则显示该slot内容，否则，显示一个默认的view内容
view 和 slot 是否在同一个位置上呢？
是的。
就好像显示商品的图片，如果有配置则显示配置的图片（slot传入），如果没用的话显示一个默认的图片（静态固定的）。
显示位置、效果等都是一样的，区别仅在于参数
刚刚发现可以用 :empty 伪类来找到这个节点，然后把节点给隐藏起来
方案:
如下,当没有内容时,显示空图标
wxml:
<view class="container" > <view class="page-header"><slot name="header" /></view> <view class="page-body"> <view class="page-content"><slot /></view> <empty class="empty" text="{{emptyText}}" icon="{{emptyIcon}}" /> </view> </view>wxss:
.empty{ visibility:hidden } .page-content:empty + .empty{ visibility:visible; }类似vue会提供this.$slots['name']用于判断。
功能场景就是上面我写的，实现一个多slot组件，当复杂度较高时可以通过判断slot是否存在来控制组件展示样式
<view a:if="{{$slots.$default}}" class="am-input-label {{labelCls}}">
<slot />
</view>
slot能否放到js变量里 需要<component><sub data-id="1">标题1</sub><sub data-id="2">标题2</sub></component> 获取中间的拼接成二维数组 在组件里使用 这样代码比较直观 不然只能写成<sub data-id="1" data-title="标题1" />
支付宝小程序上可以这么做 微信上失效了
<view a:if="{{$slots.$default}}" class="am-input-label {{labelCls}}">
<slot />
</view>
查了一下，并没有相关的 api。
业务情况是需要先根据是否提供了 slot 再决定如何渲染。
虽然没实现过，不过现在已经有相关的api了