微信小程序如何解析html内容
最近项目上遇到在微信小程序里需要显示新闻内容,新闻内容是通过接口读取的服务器中的富文本内容,是html格式的,小程序默认是不支持html格式的内容显示的,那我们需要显示html内容的时候,就可以通过wxParse来实现。
首先我们在github上下载wxParse
首先我们在github上下载wxParse
icindy/wxParse
wxParse-微信小程序富文本解析自定义组件,支持HTML及markdown解析. Contribute to icindy/wxParse development by creating an account on GitHub.
1.在app.wxss全局样式文件中,需要引入wxParse的样式表
@import “/page/wxParse/wxParse.wxss”;
2.在需要加载html内容的页面对应的js文件里引入wxParse
var WxParse = require(’…/…/wxParse/wxParse.js’);
3.js里面定义内容
var article = res.data.data.article;
WxParse.wxParse(‘article’, ‘html’, article, that,5);
4.在页面中引用模板
<import src="…/…/wxParse/wxParse.wxml"/>
<template is=“wxParse” data="{{wxParseData:article.nodes}}"/>
微信小程序如何解析html内容的更多相关文章
- 微信小程序获取输入框(input)内容
微信小程序---获取输入框(input)内容 wxml <input placeholder="请输入手机号码" maxlength="11" type= ...
- 微信小程序--仿微信小程序朋友圈Pro(内容发布、点赞、评论、回复评论)
微信小程序--仿微信小程序朋友圈Pro(内容发布.点赞.评论.回复评论) 项目开源地址M朋友圈Pro 求个Star 项目背景 基于原来的开源项目 微信小程序仿朋友圈功能开发(发布.点赞.评论等功能 ...
- ****微信小程序架构解析
| 导语 微信小程序的公测掀起了学习小程序开发的浪潮,天生跨平台,即用即走.媲美原生体验.完善的文档.高效的开发框架,小程序给开发者带来了很多惊喜.通过这篇文章和大家一起分析小程序的架构,分享开发 ...
- 一起脱去小程序的外套和内衣 - 微信小程序架构解析
版权声明:本文由渠宏伟 原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/760767001484042227 来源:腾云阁 ...
- 高大上的微信小程序中渲染html内容—技术分享
大部分Web应用的富文本内容都是以HTML字符串的形式存储的,通过HTML文档去展示HTML内容自然没有问题.但是,在微信小程序(下文简称为「小程序」)中,应当如何渲染这部分内容呢? 解决方案 wxP ...
- 微信小程序session_key解析中反斜杠问题处理 Java解析
Java服务端微信小程序解密用户信息.手机号需用到session_key也需要decode,以下是官方描述: 加密数据解密算法 接口如果涉及敏感数据(如wx.getUserInfo当中的 openId ...
- 微信小程序 获得用户输入内容
在微信小程序里,如何获得用户输入的内容?? js: document.getElementById("Content").value jq:$("#Content&quo ...
- 微信小程序路径表达式解析规则
小程序 setData 方法支持路径表达式来设置属性,例如 setData({"x.y.z": 1}). 微信官方没有公布路径表达式的语法规则及解析规则,本文所描述的路径表达式解析 ...
- PHP 实现微信小程序敏感图片、内容检测接口
主要是为了调用微信小程序msgSecCheck.imgSecCheck接口. 先附上小程序接口说明文档地址:https://developers.weixin.qq.com/miniprogram/d ...
随机推荐
- python编程基础之二十
字符串的其他常用方法: ord(char) # 返回char字符对应的码值,可以是中文字符 chr(x) # 输入一个unicode码,返回对应的字符 eval(str) # 将str 中的内容 ...
- app微信支付
<?php namespace app\api\controller\v1; use think\Request; use app\api\exception\weappay\lib\WxPay ...
- cobalt strike笔记-常用beacon扫盲
最近还是重新补一下cs的东西 0x01 Beacon命令 Beacon Commands =============== Command Description ------- ----------- ...
- 收益 or 挑战?Serverless 究竟给前端带来了什么
作者 | 黄子毅(紫益) 阿里前端技术专家 导读:前端开发者是最早享受到 "Serverless" 好处的群体,因为浏览器就是一个开箱即用.甚至无需为计算付费的环境!Serverl ...
- Google研发面试题
今天很开心找到了一个很不错的研发面试题,很考验临时反应能力,特地拿出来和大家分享一下此题以及自己做该题的心得体会!!! 题目: 总共有12个外表都一样的金属球,其中有11个球的重量是相同的,1个球的重 ...
- html、css、javascript之间的关系
网页主要由三部分组成: 结构( Structure) . 表现( Presentation) 和行为( Behavior)HTML —— 结构, 决定网页的结构和内容( “是什么”)CSS —— 表现 ...
- Linux面试题-7
在日常管理中,通常CPU会影响系统性能的情况是: A A:CPU已满负荷地运转 B:CPU的运行效率为30% C:CPU的运行效率为50% D:CPU的运行效率为80% 下面那个命令可以终止一个用户的 ...
- C#发送电子邮件(SMTP)及outlook.com账号之概要
这是关于c#发送电子邮件(SMTP)的技术笔记,以”简报“形式呈现. 因为最后成功通过outlook.com发送了邮件,所以,我觉得还是有必要 记录一下其中的要点. 一.技术核心 .net Frame ...
- 图论-最短路径<Dijkstra,Floyd>
昨天: 图论-概念与记录图的方法 以上是昨天的Blog,有需要者请先阅读完以上再阅读今天的Blog. 可能今天的有点乱,好好理理,认真看完相信你会懂得 分割线 第二天 引子:昨天我们简单讲了讲图的概念 ...
- 学习笔记:flutter项目搭建(mac版)
什么是flutter Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面. Flutter可以与现有的代码一起工作.在全世界,Flutter正在被越来越多的 ...
