小程序11-rich-text组件
rich-text是富文本标签,可以将字符串解析成对应标签,类似vue中 v-html功能;其利用nodes属性接收输入的html值,nodes可以接收以下两种类型值:标签字符串 和 对象数组。
.wxml文件
<rich-text nodes="{{html1}}"></rich-text> <rich-text nodes="{{html2}}"></rich-text>
.js文件
Page({ data: { html1:`<h1>这里是h1标签,富文本会将元素当成HTML标签解析后输出--字符串格式</h1>`, html2:[ { // 1 div标签 name属性来指定 name:'h1', // 2 标签上有哪些属性 attrs:{ // 标签上的属性 class style class:'my_h1', style:"color:red;" }, // 2 子节点 children 要接收的数据类型和 nodes第二种渲染方式的数据类型一致 children:[ { name:"p", attrs:[], // 放文本 children:[ { type:"text", text:"这里是h1标签,富文本会将元素当成HTML标签解析后输出--数组格式" } ] } ] } ] }, })
作者:跳跃的皮皮虾
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。