更新记录

1.0(2021-10-22) 下载此版本

首次发布


平台兼容性

Vue2 Vue3
×
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
HBuilderX 3.1.0 × × × × ×
钉钉小程序 快手小程序 飞书小程序 京东小程序
× × × ×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari
× × × × × × × × ×

还在用rich-text呈现富文本吗?全能Towxml解析库支持图表、公式、音频、视频等

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

将已构建好的项目分享给大家:

特色

Towxml 3.0 完整支持以下功能。当然在构建时可仅保留需要功能以减少体积大小和代码依赖。

  • 支持echarts图表(3.0+)✨
  • 支持LaTex数学公式(3.0+)✨
  • 支持yuml流程图(3.0+)✨
  • 支持按需构建(3.0+)✨
  • 支持代码语法高亮、代码块行号显示
  • 支持emoji表情😉
  • 支持上标、下标、下划线、删除线、表格、视频、图片(几乎所有html元素)……
  • 支持typographer字符替换
  • 支持多主题切换
  • 支持Markdown TodoList
  • 支持事件绑定(这样允许自行扩展功能哟,例如:点击页面中的某个元素,更新当前页面内容等...)
  • 极致的中文排版优化
  • 支持前后解析数据

项目地址:GitHub - sbfkcel/towxml: 微信小程序HTML、Markdown渲染库

uniapp引入使用

已构建得到最终的代码的towxml文件夹复制到uniapp工程的static目录下

在main.js 挂载

...
import App from './App'

import towxmlFunc from '@/static/towxml/index.js';
Vue.prototype.$towxmlFunc = towxmlFunc;
...

页面使用

<template>
    <view><towxml :nodes="markdownData"></towxml></view>
</template>
<script>
import towxml from '@/static/towxml/towxml';
export default {
    components: {
        towxml
    },
    data() {
        return {
            markdownData: ''
        };
    },
    onLoad(options) {
        uni.request({
            url: 'https://www.vvadd.com/wxml_demo/demo.txt', 
            success: res => {
                this.markdownData = this.$towxmlFunc(res.data, 'markdown');
            }
        });
    }
};
</script>

交流

有需要可加交流群(857064044)交流群

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问