先來看一下效果圖

image.png

直接上代碼

{{item.value}}

export default {

data() {

return {

richStr: '測試測試Weex啊發送到發送發大水測試Weex測試Weex測試你是誰測試Weex測試Weex測試, 測試測試Weex測試Weex測試Weex測試我試試額立刻就發牢騷的空間放辣椒水淀粉盧卡斯地方測試Weex測試Weex測試',

configList: [],

}

},

created() {

this.setupConfigList()

},

methods: {

setupConfigList(){

//著重顯示的文字

let tip = '測試'

let tmpTip = '?' + tip + '?'

let tmpArr = this.richStr.replace(new RegExp(tip, 'g'), tmpTip).split('?')

var strArr = tmpArr.filter(e => {

return e != ''

})

// console.log(JSON.stringify(strArr))

this.configList = []

strArr.map(e => {

let eArr = e.split('')

if (e == tip) {

for (var i = 0; i < eArr.length; i++) {

this.configList.push({

value: eArr[i],

fontSize: 30,

color: 'red'

})

}

} else {

for (var i = 0; i < eArr.length; i++) {

this.configList.push({

value: eArr[i],

fontSize: 28,

color: '#333333'

})

}

}

})

}

}

}

如果需要下劃線， 或者點擊時間可以在configList對象里面配置相關屬性， 來支持！

總結

以上是生活随笔為你收集整理的weex 富文本_Weex richtext 富文本某个字加重显示的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。