E企盈营销工具技术服务商 热线:4006-838-530

小程序解析html富文本插件wxParse配制全面指南

E企盈直播平台营销卖货系统

第一步:下载wxParse下载地址:https://github.com/icindy/wxParse点击下载压缩包包含的文件,【红框文件】需要拷贝到小程序根目录第二步:使用教程官网教程(原本想说的,还是算了,如果想看的直接去作者:https://github.com/icindy/wxParse 这里看就行了!我看了这个文档,竟然进了一次坑!直接晒我的教程吧!)我的教程第一步:配制xx.wxml文件(配制到你用到的页面中) [html] view plain copy<import src=”../../wxParse/wxParse.wxml”/>   第二步:配制xx.wxss文件(配制到你用到的页面中)[html] view plain copy@import “../../wxParse/wxParse.wxss”;  第三步:配制xx.js文件(配制到你用到的页面中)头部引用 [html] view plain copyvar WxParse = require(‘../../wxParse/wxParse.js’);  onLoad()方法里使用article_content:WxParse.wxParse(‘article_content’, ‘html’, res.data.article_content, that, 5)/** * WxParse.wxParse(bindName , type, data, target,imagePadding) * 1.bindName绑定的数据名(必填) * 2.type可以为html或者md(必填) * 3.data为传入的具体数据(必填) * 4.target为Page对象,一般为this(必填) * 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选) */  第四步:xx.wxml文件里引用(引用到你用到的页面)[html] view plain copy<view><template is=”wxParse” data=”{{wxParseData:content.nodes}}” /></view>  完成这四步,就完美完成了,但是有得编辑器里面的图片不是绝对地址,所以会引起图片不显示的问题!图片不显示问题修改文件【html2json.js】代码所在位置这里的【server_url】就是指你的域名,我是直接在顶部【 ver】了一个变量【server_url】赋值的域名地址,所以你看到的这块代码出现了【server_url】!1.把wxParse文件全部放入项目。2.在wxml中import wxParse.wxml,并把template插入到到对应的位置上[html] view plain copy<!–wxml–>  <import src=”../../../wxParse/wxParse.wxml”/>  <view class=”view-title”>{{title}}</view>  <view class=”view-time-box”>    <text class=”view-date”>{{date}}</text>    <text class=”view-time”>{{time}}</text>  </view>  <template is=”wxParse” data=”{{wxParseData:article.nodes}}”/>  3.在wxss中import wxParse.wxss,并设置样式;比如‘wxParse-image’是富文本图片转化成image组件之后的类名,‘wxParse-p’是p标签转化成view组件后设置的类名[css] view plain copy<!–wxss–>  @import “../../../wxParse/wxParse.wxss”;  page{    background: #fff;  }  .view-title{    line-height: 80rpx;    font-size: 48rpx;    color:#0C0C0C;    overflow: hidden;  AD:【E企盈小程序开发公司】E企盈系统专业开发:直播系统,直播平台系统源码,小程序,商城版小程序,分销小程序,小程序定制,微分销,微商,微信分销,微信分销商城,微信分销系统,微信分销管理,微信分销平台,微商代理系统,E企盈是专业的直播小,E企盈是专业的直播小程序,公众号分销系统,营销系统,社群私域流量卖货系统技术开发商,热线:4006-838-530

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 小程序解析html富文本插件wxParse配制全面指南
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏