• 使用externalClass自定义组件样式:解决小程序自定义组件无法使用iconfont的问题


    问题:

      iconfont在全局、页面Page当中,这个iconfont是都可以出来的;

      但是在自定义组件Components里面,这个iconfont是出不来的。

    问题原因:

      看了小程序的文档,才发现

      也就是说:组件中,app.wxss中的全局样式无效;把iconfont的css在组件中重新引入就能正常展示icon了。

      其实是全局的样式对自定义的组件无效

      重新引入组件文件的解决方式有点low,所以继续看文档

      可以使用externalClass自定义组件样式

      看官方文档,万变不离其宗。官方文档就是最基本的游戏规则,我们可以根据官方的示例,照葫芦画瓢,实现我们自己的功能。

      实践:

      组件内声明externalClasses,

    Component({
      properties: {
        link: {
          type: Object,
          value: {}
        }
      },
      externalClasses: ['icon-class']
    })
    <i class="icon-class"></i>

      父组件传入class

    <LinkModel wx:if="{{dt.link}}" icon-class="iconfont cs-link"
    link="{{tools.jsonToObj(dt.link)}}"></LinkModel>

      这样就ok啦

  • 相关阅读:
    404、500、502等HTTP状态码介绍
    Linux系统信息查看命令
    SVN clean up 无法继续
    gitlab使用
    Git SSH Key 生成步骤
    gitlab 杂记
    JS函数
    MySQL基础
    WEB测试方法
    操作系统的发展史
  • 原文地址:https://www.cnblogs.com/goloving/p/12752074.html
Copyright © 2020-2023  润新知