现在把需求简化， 简单说明下我需在遇到的一些尴尬情况
假如我现在需要一个类似列表的自定义组件 custom-li, 内容如下
<view class="custom-li {{class}}"> <slot name="left"></slot> <slot name="right"></slot></view> |
疑问： 那我怎么让 <custom-li>和<custom-li>中间显示分割线呢。 如正常情况下我只要有下面的这样代码就可以实现了
li + li{border-top:1px solid #000} |
但是自定义组件的机制让.custom-li + .custom-li 的形式并不能实现。另外自定义组件可以引用外部样式类，但是实测并没有生效，而且万一我需要加入的样式类很多，或者各个地方不同，那是不是每次引用的时候都要去修改自定义组件的配置？为什么不能像内置组件那样直接让传入的样式类生效呢？
这种情况有没有更好的解决方案呢？
2. 现在我需要一个 根据不同类型 显示相似内容的自定义组件，因为组件比较复杂，所以要针对不用的情况把代码拆分开，方便开发
- 现在我需要一个 index 的自定义组件用来分发不同类型（为什么不用抽象组件，因为我需要在组件内部去判断，而不是在使用的地方判断）
<type-one wx:if="{{type == 1}}"><type-one><type-two wx:if="{{type == 2}}"><type-two> |
- 然后需要 一个 template 用来存放相似的格式， 实际情况比这种要复杂
<view> <slot name="header"></slot> <slot name="content"></slot> <slot name="footer"></slot></view> |
- 然后我再去编写不同的逻辑自定义组件， 当然实际情况也比这复杂
<view> <view slot="header"></view> <view slot="content"></view> <view slot="footer"></view></view> |
那么现在就已经有了3层嵌套的自定义组件了 index > template > type-one / type-two
现在的问题是：
1）每个自定义组件的样式都是不影响的，我要实现这种效果只能把样式拆分在不同的自定义组件中，甚至有些需要依赖的 .parent .child 这样的样式拆分都没有用
2）每个自定义组件的都有各自的data数据，假如我有个字段 visible 来控制header的显示和隐藏， 那么我需要一层一层把这个visible传递下去，感觉很复杂，尤其是在场景比较复杂，要传的数据比较多的情况下，很明显自定义组件会增加工作量
3） 有一个bug， 如上面的index的代码， 在有逻辑判断的情况下 绑定事件 bingshow="showFn"， 在子组件中通过triggerEvent的方式触发这个show， wx:if="{{type == 1}}" 情况下并不会触发 showFn， 只有简单的 wx:if="{{type}}" 或 才能触发showFnwx:if="{{true}}"
以上是暂时想起来的问题
实际开发过程中遇到很多坑，建议贵团队完善开发文档， 同时祝愿小程序越做越好
问题，目前确实无法在组件内使用纯 wxss 的方法做到，需要你换一种方法。
externalClasses 确实可以实现类似内置组件的 hoverClass 的效果，麻烦再仔细阅读文档尝试一下。
这里可以灵活运用 @import 解决。
这个就好像你在 js 里面嵌套调用函数，也需要逐层传递一样。自定义组件的数据分离会不可避免带来很多额外的数据传递，但好处是充分的数据和逻辑分离。
这个看起来不是我们的 bug 。{{ ... }} 这种表达式，无论如何，我们会把表达式的值算出来，再判断 wx:if 条件，不会有这种区别。请检查你的 type 实际值是否正常。
样式方面的问题，你可以单纯的border-bottom然后最后一个none
为啥自定义组件的属性不能和内置组件的相同，比如我想直接用外部样式类直接用class属性
比如我想用bindtap 就报错了