最近遇到一個功能,後臺管理系統添加商品的時候,商品詳情是使用富文本編輯器添加的。小程序獲取的商品詳情數據是含有<p>標籤的。
後臺管理系統
百度了多種方法,也試用了很多方法,最終覺得wxParse.js比較方便。
在頁面js文件引入wxParse.js
var WxParse = require('../../wxParse/wxParse.js');
處理接口返回的商品詳情的數據
res.goods.describes = WxParse.wxParse('article', 'html', res.goods.describes, that, 5);
WxParse.wxParse(bindName , type, data, target,imagePadding)
1.bindName綁定的數據名(必填)
2.type可以爲html或者md(必填)
3.data爲傳入的具體數據(必填)
4.target爲Page對象,一般爲this(必填)
5.imagePadding爲當圖片自適應是左右的單一padding(默認爲0,可選)
WxParse.wxParse('引用的時候的名字,如courseDetail', 'html', '你需要解析的數據,如courseDetailContent', that, 5)
在頁面wxml文件中
<!-- 引入wxParse文件 -->
<import src="../../wxParse/wxParse.wxml" />
<!-- 在商品詳情具體位置添加 -->
<template is="wxParse" data="{{wxParseData:article.nodes}}"/>