嘗試在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'}" ></text>通過以上這種方式,直接寫死unicode是可以正常渲染出來的。然而,如果將里面的字符使用變量的方式給予賦值,是無法渲染出來的。 <text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}" >{{fontName}}</text>
fontName:""嘗試各種辦法,無果,可能是底層渲染時機的問題。
2 回答

搖曳的薔薇
TA貢獻1793條經驗 獲得超6個贊
對這個問題我仔細跟蹤了下,導致的原因是:
在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: '',
}
},
computed: {
getFontName: function() {
return he.decode(this.fontName)
}
}
}
</script>

白板的微信
TA貢獻1883條經驗 獲得超3個贊
不用那么麻煩,不需要什么解碼,只需要把
換成\ue685
就可以了
<text :style="{fontFamily:'iconfont',color:'red',fontSize:'40px'}" >{{fontName}}</text> fontName:"\ue685"
- 2 回答
- 0 關注
- 1196 瀏覽
添加回答
舉報
0/150
提交
取消