Towxml

Towxml github地址

介绍

Towxml 是一个可将HTML、Markdown转为微信小程序WXML(WeiXin Markup Language)的渲染库。用于解决在微信小程序中Markdown、HTML不能直接渲染的问题。

安装使用（建议3.0，github主分支就是3.0）

本地创建一个空文件夹，使用git clone 到本地

git clone https://github.com/sbfkcel/towxml.git

安装构建依赖

npm install

按需编写config.js文件（不要改变里面的顺序，只需将注释去掉就行）

编写完配置之后运行 npm run build

运行后会在桌面产生一个towxml文件夹，只需将此文件夹放到小程序的根路径就行。

微信小程序中使用

在app.js文件中引入库

towxml:require('/towxml/index')

在需要使用的页面.json中引入组件

"towxml":"/towxml/towxml"

在页面中（wxml）插入组件

<view class="container">
  <towxml nodes="{{result}}"/>
</view>

js文件中使用

//获取应用实例
const app = getApp();
Page({
	data: {
		isLoading: true,					// 判断是否尚在加载中
		article: {}						// 内容数据
	},
	onLoad: function () {
		//res为md数据 或者 html数据，可以用request 请求过来
		let result = app.towxml(res,'markdown',{
			base:'https://xxx.com',				// 相对资源的base路径
			theme:'dark',					// 主题，默认`light`
			events:{					// 为元素绑定的事件方法
				tap:(e)=>{
					console.log('tap',e);
				}
			}
		});

		// 更新解析数据
		this.setData({
			article:result,
			isLoading: false
		});
		
	}
})

注意：请求的数据为html格式需要将markdown也变为html格式，如果使用html可能代码块不换行，所有代码都在同一行，建议使用md格式的进行解析渲染。

events事件

该事件是在点击了渲染出来的内容的时候会显示点击部分的信息，可以自己按需要进行操作该部分的元素。