1. 程式人生 > 其它 >小程式富文字解析官方元件 案例

小程式富文字解析官方元件 案例

近日小程式開發過程中,介面資料顯示是HTML格式的,即富文字格式:

點選此連結,這是個官方推薦元件;

2· 我分享一下我自己的應用此元件的一些心得;

>1,引入

 const WxParse = require(`../../wxParse/wxParse`);
  /**
   * 資料中引入  news_details[0].content  這個就是需要解析的富文字資料
   */
 WxParse.wxParse('detail', 'html', news_details[0].content, that, 0);
<!-- 富文字類 -->
    <import 
src="../../wxParse/wxParse.wxml" /> <view class='con_text'> <template is="wxParse" data="{{wxParseData:detail.nodes}}"/> </view>

>3, 修改css樣式,得到自己想要的效果,方法很簡單,我直接放程式碼了!

view.con_text view, view.con_text text{
  width: 690rpx;
  font-size: 28rpx !important;
  display: inline-block !important
; letter-spacing: 1rpx !important; text-align: justify !important; line-height: 50rpx !important; }

重點就是 !important 啦。