相信遇到這個(gè)問題的朋友不在少數(shù)鹿蜀，大家在開發(fā)小程序的時(shí)候，并不是所有界面都用的wxml服球，有些通過后臺可視可編輯器如ueditor添加的內(nèi)容茴恰，還是原生的html,這些原生的html內(nèi)容包含了圖片、表格斩熊、列表往枣、鏈接、css樣式、文本等內(nèi)容分冈，這些內(nèi)容在小程序界面中顯示的話圾另，就需要能在小程序中顯示html內(nèi)容的富文本組件，用的比較多的是parser雕沉，后來改名不mp-html
mp-html功能介紹
?? 支持在多個(gè)主流的小程序平臺和 uni-app 中使用
? ? 支持豐富的標(biāo)簽（包括 table集乔、video、svg 等）
? ? 支持豐富的事件效果（自動預(yù)覽圖片坡椒、鏈接處理等）
? ? 支持設(shè)置占位圖（加載中扰路、出錯(cuò)時(shí)、預(yù)覽時(shí)）
? ? 支持錨點(diǎn)跳轉(zhuǎn)倔叼、長按復(fù)制等豐富功能
? ? 支持大部分 html 實(shí)體
? ? 豐富的插件（關(guān)鍵詞搜索汗唱、內(nèi)容 編輯 等）
? ? 效率高、容錯(cuò)性強(qiáng)且輕量化（≈24.5KB丈攒，9KB gzipped）
在使用這個(gè)組件的時(shí)候哩罪，會發(fā)現(xiàn)一個(gè)問題，就是后臺添加多張連接的圖片時(shí)肥印，在小程序中顯示的并不是連續(xù)的圖片识椰，而是兩張圖片之間留了一條空白，這條空白很明顯將兩張圖片分裂了深碱，對于有些圖片腹鹉，分開顯示也不影響當(dāng)然無所謂。對于有些圖片如衣服模特照片敷硅，原圖經(jīng)過圖片壓縮切為多張小圖功咒，后臺通過ueditor添加后，小程序中绞蹦，會將原本效果很好的模特圖片撕裂為多截力奋，臉部、身體幽七、腿部等斷為幾截景殷，中間留了一條長長的白條，效果就非常差了澡屡。
對于這個(gè)問題猿挚，網(wǎng)上給了好多的解決方案，但是治標(biāo)不治本驶鹉，比如在后臺添加sytle樣式進(jìn)行控制绩蜻，但是有些版本的editor，在保存的時(shí)候室埋，會把style標(biāo)簽過濾掉办绝，在小程序顯示的時(shí)候伊约，其實(shí)是沒有這個(gè)樣式的。作者在在開發(fā)巨鯨藍(lán)海微商城V2.1的時(shí)候孕蝉，就遇到了這樣的問題屡律，這個(gè)商城帶到商品展示、搜索昔驱、購物車疹尾、訂單上忍、積分兌換骤肛、積分變現(xiàn)、二級分銷窍蓝、商城公告腋颠、個(gè)人消息等功能，商品展示完成后吓笙，發(fā)現(xiàn)商品詳情頁居然有空白淑玫，經(jīng)過一翻詳細(xì)測試，發(fā)現(xiàn)了問題原因面睛，網(wǎng)上說的辦法后臺添加的style絮蒿、前面使用正則添加class屬性都沒有作用，還是parser的原生作者給的解決方案最靠譜叁鉴，使用正則土涝，desc = desc.replace(/\<img/gi, '<img style="vertical-align:bottom;"'); 把要顯示的圖片添加一個(gè)style樣式即可。添加好的效果如圖所示：展示效果
