当前位置: 移动技术网 > IT编程>网页制作>HTML > 微信小程序开发富文本插件wxParse的使用(富文本转化为view文本内容,多用于用户协议)

微信小程序开发富文本插件wxParse的使用(富文本转化为view文本内容,多用于用户协议)

2020年07月17日  | 移动技术网IT编程  | 我要评论
需求:申请成为分销商后,阅读同意 分销申请协议 后 需要跳转到 协议页面思路:从后台接口获取富文本协议内容,在申请分销商页面设置异步缓存,然后在协议页面读取缓存,引入富文本协议转化为html的插件,读取出来,关键是插件的引入这里我会在上次资源里面传入我引入的插件部分,页面编写很简单,上代码一、上面图片代码是申请分销商的页面,是图片1/**下面是申请分销商的html*/<checkbox-group class="agreement-check" bindchange="checkboxC

需求:申请成为分销商后,阅读同意 分销申请协议 后 需要跳转到 协议页面

思路:从后台接口获取富文本协议内容,在申请分销商页面设置异步缓存,然后在协议页面读取缓存,引入富文本协议转化为html的插件,读取出来,关键是插件的引入
这里我会在上次资源里面传入我引入的插件部分,页面编写很简单,上代码

一、
申请分销商
上面图片代码是申请分销商的页面,是图片1

/**下面是申请分销商的html*/
<checkbox-group class="agreement-check" bindchange="checkboxChange">
        <label> 
        <checkbox  disabled="{{shareInfo.id}}" value="{{checked}}" checked="{{checked}}"></checkbox>
        <text>我已阅读并同意</text> 
         <navigator url="../userAgreement/index" class="color-bule">{{apply.shareApplyAgreement}}</navigator>
         </label>
  </checkbox-group>

    /**js部分 异步设置协议缓存  data 为获取的问吧内容*/
   wx.setStorageSync('shareContent', data)

二、下面是协议的页面代码内容

/**下面是协议的的htm  引入插件,设置文本内容l*/
<import src="/wxParse/wxParse.wxml" />
	<view class='conter'>
			<template is="wxParse" data="{{wxParseData:description.nodes}}" />
		</view>

/** js部分  引入插件 */
import WxParse from '../../wxParse/wxParse.js';
Page({

/** 生命周期函数--监听页面显示  读取缓存,设置到页面
   */
  onShow: function () {
    let html=wx.getStorageSync('shareContent')
    WxParse.wxParse('description', 'html', html, this, 0);

  }
})
/** css 部分  引入 文本css插件
   */
@import "/wxParse/wxParse.wxss";


三、插件部分

https://download.csdn.net/download/angelnotears/12620075

本文地址:https://blog.csdn.net/angelnotears/article/details/107365632

如您对本文有疑问或者有任何想说的,请 点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网