Weex关于字体图标的bug

Question

尝试在android和iOS平台下使用字体图标：
1.装载字体图标

 created:function () {
            var domModule=weex.requireModule("dom");
            domModule.addRule('fontFace',{
                'fontFamily':'iconfont',
                'src':"url(\'http://at.alicdn.com/t/font_h973ii9uesgaatt9.ttf\')"
            })

        }

2.使用字体图标

<text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}" >&#xe685;</text>

通过以上这种方式，直接写死unicode是可以正常渲染出来的。然而，如果将里面的字符使用变量的方式给予赋值，是无法渲染出来的。

 <text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}" >{{fontName}}</text>

fontName:"&#xe685;"

尝试各种办法，无果，可能是底层渲染时机的问题。

Answer 1

对这个问题我仔细跟踪了下，导致的原因是：
在template中 text写死 时，weex-template-compiler在编译阶段使用了he进行decode，而在template中Mustache进行数据绑定fontName（fontName:""）时不会进行decode

既然了解了原因，可以这样解决，
在vue中引入he模块，自己进行解码

<text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}">{{getFontName}}</text>

<script>
  var he = require('he');
  module.exports = {
    data: function () {
      return {
        fontName: '&#xe685;',
      }
    },
    computed: {
      getFontName: function() {
        return he.decode(this.fontName)
      }
    }
   }
</script>

希望能帮到你

Answer 2

不用那么麻烦，不需要什么解码，只需要把换成\ue685就可以了

<text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}" >{{fontName}}</text>

fontName:"\ue685"

Answer 3

在真机上使用出现方框加×的图标，请问你有遇到吗，我在真机上用是没有错误的