微信小程序富文本解析
wxParse 微信小程序富文本解析 原因 由于原作者仓库 wxParse 不再维护,我们项目中商品信息展示又是以wxParse这个用做富文本解析的; 于是乎,决定采用 递归Component 的方式对其进行重构一番; 原项目使用的 template 模板的方式渲染节点,存在以下问题: 节点渲染支持到12层,超出会原样输出 html 代码; 每一层级的循环模板都重复了一遍所有的可解析标签,代码十分臃肿。 li 标签不支持 ol 有序列表渲染(统一采用的是 ul 无序列表), a 标签无法实现跳转,也无法获取点击事件回调等等; 节点渲染没有绑定 key 值,一是在开发工具看到一堆的 warning 信息(看着十分难受),二是节点频繁删除添加,无法比较 key值 ,造成 dom 节点频繁操作。 功能标签 目前该项目已经可以支持以下标签的渲染: audio标签(可自行更换组件样式,暂时采用微信公众号文章的 audio 音乐播放器的样式处理) ul标签 ol标签 li标签 a标签 img标签 video标签 br标签 button标签 h1, h2, h3, h4标签 文本节点 其余块级标签 其余行级标签 支持 npm包 引入 npm install --save wx-minicomponent 使用 原生组件使用方法 克隆 项目 代码,把 components目录