小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?

·小程序外部css样式app.wxss如何引用关联生效到组件内?

·小程序组件内怎么引用阿里iconfont字体样式?

有些小伙伴发现在组件中使用阿里iconfont的图标样式未能生效,是因为小程序官方说组件内的样式只能在组件内使用,是一个样式隔离保护。因此组件内的样式也不会影响到外部。

以下有三种方法可以解决

  1. 将字体文件样式直接复制到组件内,小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
    然后在组件样式表中引用即可小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
  2. 在外部(如page页面中)使用组件时传递当前可以访问到的样式(l-search是我自己引用的组件)。如下图
    小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
    然后在组件中的js文件中定义传入的值。如下图小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
    可以多尝试以下。
  3. 设置当前组件的样式隔离属性值小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
    文档中提供几个对应不同效果的值,如下图小程序外部css样式app.wxss如何引用关联生效到组件内?小程序组件内怎么引用使用阿里iconfont字体样式?
    我使用的是apply-shared,即外部页面的css样式可以影响到组件内部,但组件内部的值影响不到外部页面的样式。

以上三种可能比较常用,如还有更加方便的方法还请在留言区讨论下。

本文章是我一个字一个字的打出来,图也是我自己做,本人也是正在看各种视频学习中,发现一些好的会写出来也算给自己加深印象吧。如有雷同纯属巧合。

**

一只正在成长的猿!大家一起努力。

**