如何在 JS 和 SCSS 间共享变量?



  • 我使用了 taro-iconfont 组件来管理图标。这个组件会把 svg base64之后当做 View 的 background-image 来显示图标。并且可以传入一个 color 值,然后自动处理成 svg 的fill,从而实现图标颜色变化。
    具体的,它会把所有的 svg 写到 wxml 里去。并给每个 svg 写一个 fill='{{(isStr ? colors : colors[0]) || 'rgb(51,51,51)'}}' 这样的代码来实现。

    那么问题来了。

    1. 我的颜色是在 scss 里定义的。
    2. taro-iconfont 是类似这样的调用: <Iconfont name='user' color='#ff0000' /> 来指定颜色。然后把color再写到 background-image 里去。
    3. 所以我需要把 scss 里的颜色定义传到 js 里来。

    我尝试使用 scss 的 :export 并不能得到这个颜色定义,而是报了一个 wxml 错,是不是我需要再改点啥 loader 的?


登录后回复