解決:微信小程式富文字識別不了空白p標籤的方法
阿新 • • 發佈:2021-06-28
後臺富文字有時候會給空白的換行,像這樣
但是小程式貌似解析出這樣的標籤不會留出它空白的位置,<br/>標籤頁不能被轉換識別
試過提交 : <p></p> 、<p><br/></p>、<br/>這三種方式,前端照樣不顯示空白內容的換行
不管是rich-text還是wxParse 都達不到想要的效果
一直這樣...
我就放棄了嗎?
不!
首先試試強制給標籤加padding,達到效果:
但是這樣每個解析的標籤都有padding. 文字就變得很....
所以我嘗試修改wxParse 來達到效果
我是在頁面js直接解析的,一步步找到了方法,具體位置如下
if (node.tag === 'p') { //當前如果是p標籤 if (node.nodes == undefined) { //如果沒有nodes就強行賦值nodes var nodes = [{ attr: { style: ["padding:", "15rpx", "0"] }, index:"0.0.0.0", node: "element", tag: "span", tagType: "inline", styleStr: "padding:15rpx 0;" }] node.nodes = nodes } }
在end方法裡面,通過對比其他正常解析的元素髮現,換行p會被解析,但是因為沒有內容,所以沒有nodes
所以我先給了首行內容一個color ,抄他給color的樣子強賦值給沒有nodes的node
也算是曲線救國吧,暫時也沒有別的辦法
新增之後,已經能夠展示空白換行的部分了
圓滿!收工!