微信小程序中显示html格式内容的方法
更新时间：2017年04月25日 16:01:40 作者：隔壁陈叔叔
最近在工作中遇到一个需求，需要在不能显示html格式的微信小程序中显示html格式的内容，通过查找相关的资料发现可以利用wxParse来实现，下面这篇文章就主要给大家介绍了微信小程序实现显示html格式内容的方法，需要的朋友可以参考借鉴，下面来一起看看吧。
前言
最近项目上遇到在微信小程序里需要显示新闻内容，新闻内容是通过接口读取的服务器中的富文本内容，是html格式的，小程序默认是不支持html格式的内容显示的，那我们需要显示html内容的时候，就可以通过wxParse来实现。
准备工作：
首先我们下载wxParse
github地址：https://github.com/icindy/wxParse
本地下载：http://xiazai.jb51.net/201704/yuanma/wxParse-master(jb51.net).rar
wxParse
下载完之后我们需要用到目录下的wxParse文件夹，把他拷贝到我们的项目目录下
下面是具体的使用步骤
1、在app.wxss全局样式文件中，需要引入wxParse的样式表
@import "/page/wxParse/wxParse.wxss";
2、在需要加载html内容的页面对应的js文件里引入wxParse
var WxParse = require('../../wxParse/wxParse.js');
3、通过调用WxParse.wxParse方法来设置html内容
/** * WxParse.wxParse(bindName , type, data, target,imagePadding) * 1.bindName绑定的数据名(必填) * 2.type可以为html或者md(必填) * 3.data为传入的具体数据(必填) * 4.target为Page对象,一般为this(必填) * 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选) */
Page({
data: {
},
onLoad: function () {
var that = this;
wx.request({
url: '',
method: 'POST',
data: {
'id':13
},
header: {
'content-type': 'application/json'
},
success: function(res) {
var article = res.data[0].post;
WxParse.wxParse('article', 'html', article, that,5);
}
})
}
})
4、在页面中引用模板
<import src="../../wxParse/wxParse.wxml"/>
<template is="wxParse" data="{{wxParseData:article.nodes}}"/>
这样就可以在微信小程序中嵌入html内容了
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
相关文章
Javascript调试工具（下载）...2007-01-01
这篇文章主要介绍了JavaScript函数的调用以及参数传递,是JavaScript入门学习中的基础知识,需要的朋友可以参考下2015-10-10
尽管JavaScript的拥趸一再强调js的面相对象,然而,或许只有在名为Object的这一类型中才能勉强理解出-- well...下面就让我们一起来浅析JavaScript中的对象类型Object2016-05-05
Javascript模块化编程，已经成为一个迫切的需求。理想情况下，开发者只需要实现核心的业务逻辑，其他都可以加载别人已经写好的模块但是，Javascript不是一种模块化编程语言，它不支持类class，更遑论模块module了2013-01-01
下面小编就为大家带来一篇JavaScript基础教程——入门必看篇。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-05-05
这篇文章主要介绍了Javascript的this的作用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
下面小编就为大家带来一篇几种经典排序算法的JS实现方法。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-03-03
这篇文章主要介绍了js基础知识，包括公有方法、私有方法，以及特权方法的使用介绍，感兴趣的小伙伴们可以参考一下2015-11-11
这一章会对范围对象做一些介绍。使用这个对象你能选取HTML文档中的任何部分然后根据选取信息作一些事情。最常见的范围对象是由用户选择的。2010-02-02
ie和firefox中img对象区别的困惑...2006-12-12
最新评论