微信小程序|组件-富文本rich-text
Posted 準提童子
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序|组件-富文本rich-text相关的知识,希望对你有一定的参考价值。
1. 效果图
2. wxml代码
<!-- rich-text富文本,可渲染html -->
<view class="page-body">
<view class="page-section">
<view class="page-section-title">传入html字符串</view>
<view class="rich-text-wrp">
<rich-text nodes="html" bindtap="tap"></rich-text>
</view>
</view>
<view class="page-section">
<view class="page-section-title">传入节点列表</view>
<view class="rich-text-wrp">
<rich-text nodes="nodes" bindtap="tap"></rich-text>
</view>
</view>
</view>
3. js代码
Page(
data:
html: '<div class="div_class" style="line-height: 60px; color: red;">Hello World!</div>',
nodes: [
name: 'div',
attrs:
class: 'div_class',
style: 'line-height: 60px; color: red;'
,
children: [
type: 'text',
text: 'Hello World!'
]
]
,
tap()
console.log('tap')
)
以上是关于微信小程序|组件-富文本rich-text的主要内容,如果未能解决你的问题,请参考以下文章
微信小程序富文本rich-text使用详解-微信小程序系统学习攻略