微信小程序中显示html富文本的方法
微信小程序中显示html富文本的方法
使用方法:
git地址:https://github.com/icindy/wxParse
一、下载wxParse文件
二、在要引入的页面的js文件中,引入文件
js文件中
var WxParse = require('../../../weui/wxParse/wxParse.js');
css文件中
@import "../../../weui/wxParse/wxParse.wxss";
页面中
<import src="../../../weui/wxParse/wxParse.wxml" />
三、数据绑定
在page.js文件中绑定数据
如:
onLoad: function (options) {
var that = this;
var detail_content ="<div>我是HTML代码</div>";
WxParse.wxParse('detail_content', 'html', detail_content, that, );
} //注意第一个参数需要与wxml中的一致
四、在page的wxml中引入模板
<view class="newsDt_wrap">
<template is="wxParse" data="{{wxParseData:detail_content.nodes}}" />
<view class="last_date">最后更新于:{{initDate.publish_time}}</view>
</view>
微信小程序中显示html富文本的方法的更多相关文章
- 微信小程序中获取高度及设备的方法
由于js中可以采用操纵dom的方法来获取页面元素的高度,可是在微信小程序中不能操纵dom,经过查找之后发现仅仅只有以下几个方法可以获取到高度 wx.getSystemInfoSync().window ...
- 开发微信小程序 中遇到的坑 及解决方法
1.wx.request 只能访问 https 解决: 新建项目 不填appid 即可访问 localhost 2.页面中多重三元表达式 解析有问题 解决: <!--{{index}} { ...
- 微信小程序中显示与隐藏(hidden)
1.wx.wxml页面部分 <view bindtap='click'>点击</view> //这是显示隐藏的部分 <view hidden="{{hidden ...
- 去除富文本中的html标签及vue、react、微信小程序中的过滤器
在获取富文本后,又只要显示部分内容,需要去除富文本标签,然后再截取其中一部分内容:然后就是过滤器,在微信小程序中使用还是挺多次的,在vue及react中也遇到过 1.富文本去除html标签 去除htm ...
- 在微信小程序中使用富文本转化插件wxParse
在微信小程序中我们往往需要展示一些丰富的页面内容,包括图片.文本等,基本上要求能够解析常规的HTML最好,由于微信的视图标签和HTML标签不一样,但是也有相对应的关系,因此有人把HTML转换做成了一个 ...
- 微信小程序中视频的显示与隐藏
在微信小程序中实现视频的播放与暂停 需求: 视频列表中只能有一个视频在播放 点击视频实现播放与暂停功能 加载完成显示图片,点击后变为视频播放 从上次播放的位置进行播放 思路: 定义一个标记变量,控制视 ...
- 微信小程序中转义字符的处理
在微信小程序开发过程中,有时候会用到常用的一些特殊字符如:‘<’.‘>’.‘&’.‘空格’等,微信小程序同样支持对转义字符的处理,下面提供两种方法用来处理微信小程序中转义字符的处理 ...
- 全栈开发工程师微信小程序-中(下)
全栈开发工程师微信小程序-中(下) 微信小程序视图层 wxml用于描述页面的结构,wxss用于描述页面的样式,组件用于视图的基本组成单元. // 绑定数据 index.wxml <view> ...
- 微信小程序中的组件使用1
不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...
随机推荐
- cookie字段属性解析
一个域名下面可能存在着很多个cookie对象.如果我们用selenium的get_cookies方法,可以得到当前浏览器的多个cookie,比如: {'name': 'QCARJSESSIONID', ...
- 台哥原创:java 数独源码
2010年,当时正在做手机游戏的客户端开发工作. 每天加班之余,用了两三个晚上,开发了这个数独. 主要是生成数独数组的算法,有点难度.. 如下图:点选数字栏里的数字后,界面上所有该数字会高亮显示. ...
- nginx用途
Nginx常用来做静态内容服务器和代理服务器,用来放置静态资源或者转发请求给后面的应用服务. 1. Nginx作为静态服务器使用 作为一个Web服务器,其最主要的任务是作为静态服务器使用. 你需要将 ...
- English-taxonomy
域.界.门.纲.目.科.属.种 Domain, Kingdom, Phylum, Class, Order, Family, Genus, Species
- 测开之路七十四:python处理kafka
kafka-python地址:https://github.com/dpkp/kafka-python 安装kafka-python:pip install kafka-python 接收消息 fro ...
- mariadb(一)基础
一.数据库介绍 1.什么是数据库? 简单的说,数据库就是一个存放数据的仓库,这个仓库是按照一定的数据结构(数据结构是指数据的组织形式或数据之间的联系)来组织,存储的,我们可以通过数据库提供的多种方法来 ...
- linux使用pigz多线程压缩
因为tar zip是单线程的压缩,压缩起来很慢,这个使用使用pigz工具辅助就会使用多线程了. 安装 sudo apt install pigz 压缩 tar cvf - test.txt | pig ...
- RTSP取流设备密码含@
一.rtsp取流格式简介 RTSP的基本取流格式为:rtsp://username:password@ip_addr/... 如海康的ip地址为:rtsp://admin:admin123@10.1. ...
- Linux系统的镜像文件iso下载地址
CentOS-6.1-x86_64-bin-DVD1.iso 官方网址:http://archive.kernel.org/centos-vault/6.1/isos/x86_64/ 下载链接地址:h ...
- Yii框架怎么寻找对应视图
render()内容; public function render($view,$data=null,$return=false) { if($this->beforeRender($view ...