组件引用外部类,文档是这么说的:
https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/wxml-wxss.html
可是externalClasses和addGlobalClass到底是什么逻辑
官方能否在文档详细说明一下
经过NNNNNN验证,发现这2个是互斥的,同一个类不能同时使用2种方法
addGlobalClass引用外部类的时候,
为什么有的时候起作用,有时候有不可以呢(需要在类前面写上'view.'才能生效)
头大头大啦~~~~~~~~~~~
这两个功能实际上并不是一回事,但也有相互影响。我描述一下这里的逻辑。
默认情况下,自定义组件的 class="my-class" ,其中的 my-class 只能够在这个自定义组件的 wxss 中赋予样式,同时,这个自定义组件的 wxss 只对这个自定义组件生效。(这里就像是给 my-class 自动加入了一个前缀,像 class="xxx--my-class" 这样,同时 wxss 中也会变成 .xxx--my-class { } 。)
如果加入 addGlobalClass 选项,my-class 可以在 app.wxss 和 Page 的 wxss 中赋予样式,但这个自定义组件的 wxss 仍然只对这个自定义组件生效。(这里就像是 class="my-class xxx--my-class" 这样。)
使用 externalClass 就是另一回事了。 externalClass 由组件的父组件提供类名。这种方式类似于基础库里面 view 组件的 hover-class 这样的属性, view 的这个属性可以让页面决定 hover 时使用的样式类,这个样式类也是写在页面的 wxss 中。比如你想做一个自定义组件,自定义组件中 WXML 的一个节点的 class 是由使用这个自定义组件的页面来确定的,而且这个 class 也写在页面的 wxss 文件(或 app.wxss)中,那你应该在这里使用 externalClass 。
有这么详细的解释,明白了,谢谢!
希望文档里也有说明,估计像我这样误解的不少吧
谢谢!
好的,我们会改进一下文档的说明。(不过考虑到文档的撰写风格,应该也不会这么详细啦。)
我使用的是最新版本工具和最新库
麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)
https://developers.weixin.qq.com/s/YTqopYmr7e4e