場景
在使用小程序text組件,獲取接口返回?cái)?shù)據(jù)含\n帽揪,但實(shí)際展示時(shí)卻不能換行硝清,而是原樣展示。
如果給text組件硬編碼字符串中有\(zhòng)n转晰,則可以正常換行芦拿。
原因分析
原因分析:
數(shù)據(jù)庫中 \n
,轉(zhuǎn)json
后會變成\\n
查邢,所以不會換行蔗崎。但是你看不到,因?yàn)榍岸四玫降臅r(shí)候這個(gè)都是\n
扰藕。
解決方案
分析出原因后缓苛,解決方案就出來了。
這里使用正則替換邓深,借用小程序wxs文件未桥。
注意:
1.要想匹配到\\n
笔刹,正則表達(dá)式要用\\\\n
,這是因?yàn)檫@里涉及到\
的轉(zhuǎn)義冬耿。
2.借用小程序wxs文件舌菜,本例子中filter.wxs
。
對外暴露的方法名淆党,可以隨意起酷师。但對內(nèi),要與定義的實(shí)現(xiàn)函數(shù)名對應(yīng)起來染乌。本例中代碼如下是:
var myFilter = function(text){
if(text){
console.log(text);
var pattern = "\\\\n";
var target = "\n";
var reg = getRegExp(pattern, "g");
return text.replace(reg, target);
}
}
module.exports = {
filter_N:myFilter,
}
3.導(dǎo)入wxs山孔,并給該模塊自定義個(gè)名字;本例子中命名模塊名tools
荷憋,
在需要使用的地方台颠,就可以用了:tools.filter_N(item.adShortDesc)
<text class='ad-item-box-top-right-desc' decode='true'>{{tools.filter_N(item.adShortDesc)}}</text>
效果如下: