由于微信小程序不支持HTML代码,但我们存在服务器中的文章内容的代码都是HTML的,当我们在微信小程序上,从服务器取出的HTML数据,又如何在小程序中显示呢?这需要一个插件wxParse。
使用方法:
1.下载wxParse插件:https://github.com/icindy/wxParse,下载后解压到小程序根目录。
2.在需要显示文章内容的wxml文件中引入wxParse.wxml
<import src="/wxParse/wxParse.wxml"/>
3.在wxml文件需要显示显示文章内容的地方加入以下代码
<template is="wxParse" data="{{wxParseData:content.nodes}}"/>
4.在wxss文件中引入wxParse.wxss样式文件
@import "/wxParse/wxParse.wxss";
5.js文件代码
var WxParse = require("../../wxParse/wxParse.js");//引入wxParse.js
Page({
data: {
blog: {},
content: ''//文章内容
},
onLoad: function (options) {
var blog = options.blog;//获取加载页面时传过来的参数
var that = this;
wx.request({
url: 'weixin.html',
method: 'POST',
data: {
blog: blog,
},
success: function (res) {
that.setData({
blog: res.data,
content: WxParse.wxParse('content','html',res.data.content,that,0)//wxParse处理HTML代码
})
}
})
},
WxParse.wxParse()方法参数说明:
'content':绑定的数据名(必填)
'html':类型为HTML(必填)
res.data.content:需要处理的具体数据(必填)
that:page对象(必填)
0:当图片自适应是左右的单一padding(默认为0,可选)