BUG slot插槽位置渲染错误,样式不调用组件样式

发布于 7 年前作者 min895095 次浏览最后编辑 7 年前来自 ask
  • 当前 Bug 的表现(可附上截图)

组件,注意slot位置在

引用之后插入slot

渲染后的页面,变成了同级元素,而不是`button-list`子元素.

而且填充slot的元素没有引用button.wxss的样式。需要在引用页面在写一遍。很鸡肋

  • 预期表现

  • 复现路径

普通编译即可

  • 提供一个最简复现 Demo

已提供

2 回复
tyi
tyi1 楼6 年前

WXML 面板以 shadow root 方式展示节点树,实际位置应该是无误的。

如果你往 slot 里面放一个节点,这个节点的 class 并不应用组件的 wxss 样式,而是应用这个组件所在的父组件或页面的样式。换而言之,组件的 wxss 只影响真正写在组件 wxml 里面的节点,不影响 slot 下的节点。

nxu
nxu2 楼5 年前

那这样子我又要额外定义多个class去配置这个样式,能不能使用组件样式?像vue一样呢?

另外其实—这句话有个矛盾

组件的 wxss 只影响真正写在组件 wxml 里面的节点,不影响 slot 下的节点。

我这么改动

里边的.button样式变成如下

```

.button-list view {

background: #1fc768;

padding: 25rpx 10rpx;

border-radius: 10rpx;

}

```

是能正确应用到这个样式的

你代码片段参考一下谢谢。