小程序富文本解析官方组件 案例

近日小程序开发过程中，接口数据显示是HTML格式的，即富文本格式：

1· 点击此链接，这是个官方推荐组件；

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 啦。