微信小程序----组件之rich-text

最新推荐文章于 2024-09-12 07:50:57 发布

zhaihaohao1

最新推荐文章于 2024-09-12 07:50:57 发布

阅读量7k

点赞数

分类专栏：微信小程序

本文链接：https://blog.csdn.net/zhaihaohao1/article/details/77816959

版权

微信小程序专栏收录该内容

19 篇文章 0 订阅

订阅专栏

文档地址：https://mp.weixin.qq.com/debug/wxadoc/dev/component/

根据文档写代码

效果图

项目结构：

核心代码：

index.wxml

<view class="classname">
<rich-text nodes="{{nodes}}" bindtap="tap"></rich-text>
</view>

index.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    nodes: [{
      name: 'div',
      attrs: {
        class: 'div_class',
        style: 'line-height: 60px; color: red;'
      },
      children: [{
        type: 'text',
        text: 'Hello World!'
      }]
    }]
  },
  tap() {
    console.log('tap')
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

源码下载：
http://download.csdn.net/download/zhaihaohao1/9962142