微信小程序 wxParse使用

最新推荐文章于 2024-08-08 08:30:08 发布
最新推荐文章于 2024-08-08 08:30:08 发布
阅读量369 收藏 3
点赞数
分类专栏： 微信小程序 文章标签： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_29254653/article/details/106785938
版权

wxParse使用

1.下载 地址

github：https://github.com/icindy/wxParse
码云：https://gitee.com/hongfeifly/wxParse?_from=gitee_search

2. 解压下载文件 将wxParse文件 拷贝到小程序目录下

在这里插入图片描述

在需要使用的页面上使用wxParse
  • 在wxss文件中 使用
    在这里插入图片描述
  • wxml文件中使用
    请添加图片描述请添加图片描述
  • js文件中使用
    请添加图片描述请添加图片描述
  • 个人的修改

在我开发的项目中使用时我已经设置富文本显示的宽度，直接使用wxParse是出现图片显示的大小超出了设置的宽度

  1. wxParse.wxml文件修改
    在这里插入图片描述
  2. wxParse.js修改 （我已经设置的图片的width：100%；mode="widthFix"之后wxParse.js中计算显示的大小的计算就无用，如果你的富文本中的图片太多建议 注释到wxParse.js计算图片显示宽高的方法）
    在这里插入图片描述
qq_29254653
关注
专栏目录
微信小程序wxParse解析HTML
11-27
微信小程序 微信小程序解析富文本编辑器的HTML代码，
微信小程序插件wxParse的使用
越陌度阡
07-06 4440
由于微信小程序不支持后台富文本编辑器编辑的html，需要使用wxParse 这个插件来解析，下面介绍一下这个插件的使用方法。 1. 下载插件 在GigHub上面找到插件Demo，地址为https://github.com/icindy/wxParse，把Demo里面的wxParse目录拷贝到项目里面. 2. 在当前页面的JS里引入wxParse.js var WxParse = req......
wxParse 微信小程序富文本解析自定义组件教程
最新发布
gitblog_00969的博客
08-08 520
wxParse 微信小程序富文本解析自定义组件教程 wxParsewxParse-微信小程序富文本解析自定义组件，支持HTML及markdown解析项目地址:https://gitcode.com/gh_mirrors/wx/wxParse 项目介绍 wxParse 是一个微信小程序的富文本解析自定义组件，支持 HTML 及 Markdown 解析。它能够将 HTML 或 Markdown 格式...
推荐开源项目：wxParse - 微信小程序富文本解析库
gitblog_00095的博客
03-28 1144
推荐开源项目：wxParse - 微信小程序富文本解析库 wxParse项目地址:https://gitcode.com/gh_mirrors/wxp/wxParse 在微信小程序开发中，处理HTML或Markdown等富文本内容是一个常见的需求。然而，由于小程序自身的限制，直接展示这些复杂格式的内容并不容易。为了解决这个问题，我们推荐一个强大的开源项目——。这是一个专门针对微信小程序设计的富文...
微信小程序使用第三方组件wxParse加载富文本html
竹毛言己
07-04 4002
微信小程序使用第三方组件wxParse加载富文本html * 微信小程序 * 微信小程序加载富文本html * 微信小程序富文本第三方组件wxParse * wxParse * 富文本html
微信小程序 wxParse插件显示视频问题
01-19
修改wxParse/html2json.js 文件 ，在 html2json(html, bindName) 方法里 var node = { node: 'element', tag: tag, }; 这里使用 node.tag 能够获取标签类型，比如： img、embed、video 这里我的系统后台编辑器...
微信小程序wxParse插件图片宽高自定义设置优化
07-13
微信小程序富文本解析之图片宽高设置优化，本优化中，插件可以依据富文本中给图片设置的%或px宽高进行小程序image标签的宽高显示设置。本人充分尊重原著作者的程序编码，如对原著版权造成不良影响，请联系本人删除...
微信小程序wxParse组件及案例
07-21
wxParse是一个专门用于微信小程序解析富文本的组件，它能够有效地将HTML字符串转换为小程序可以识别的WXML结构，从而在小程序中显示复杂的图文信息。这个组件不仅支持基本的HTML标签，如`<p>`、`<img>`、`<a>`等，还...
微信小程序使用wxParse实现接入富文本编辑
03-29
微信小程序中比如活动说明，简介这样的图文介绍说明页面，后台通常配置成富文本编辑框，由后台直接输入内容，然后在小程序界面展现。 (此图片来源于网络，如有侵权，请联系删除! ) 但是富文本编辑提取到内容是html...
在微信小程序中识别html标签的方法（wxParse）
01-28
在微信小程序中识别html标签的方法（wxParse） 微信小程序-利用wxParse将html转为wxml
支付宝小程序-wxParse
05-31
支付宝小程序wxParse,富文本必备解析，省去自行修改时间。
【小程序】使用wxParse解析html
书呆子ITme
03-04 993
小程序在开发时，读取到服务器的内容是html格式的，因小程序不支持html格式的内容显示的，因此要对html格式的内容进行编译，可以通过wxParse来实现。 wxParse下载地址 实现方法： 将下载下来的wxParse文件夹复制到开发项目的根目录下。 在小程序页面对应的wxss文件中引用wxParse.wxss@import "../../wxParse/wxParse.wxss"; 在...
在微信小程序中,使用wxParse插件解析HTML/md富文本
dx3906nnn的博客
02-07 1041
在微信小程序中,使用wxParse插件解析HTML/md富文本
WxParse 微信小程序html 渲染 方法
weixin_49587053的博客
11-04 390
/** * WxParse.wxParse(bindName , type, data, target,imagePadding) * 1.bindName绑定的数据名(必填) * 2.type可以为html或者md(必填) * 3.data为传入的具体数据(必填) * 4.target为Page对象,一般为this(必填) * 5.imagePadding为当图片自适应是左右的单一padding(默认为0,可选) */ Page({ data: { }, onLoad: function (
微信小程序——wxParse使用方法
weixin_34198881的博客
11-05 281
wxParse是一个微信小程序富文本解析组件。现在小程序里面自带了一个&lt;rich-text&gt;组件也能解析富文本，但是表现不尽人意。所以我还是采用的wxParse来解析富文本的。 wxParse git地址：https://github.com/icindy/wxParse。可以先稍作了解。下面具体讲一下我实现的步骤： 1.下载 wxParse，解压，将 wxParse 放入小程序中。 ...
微信小程序wxParse用法（解析富文本）
JQ971的博客
05-30 1517
1.先下载wxparse 然后放到你的项目中 （与pages同层级） 2.然后在全局的app.wxss中引入 @import "/wxParse/wxParse.wxss"; 3.index.js引入使用 var Wxparse = require("../../wxParse/wxParse.js"); Page({ data: {} onload: function(){ Wxparse.wxParse('article', 'html', that.d
微信小程序使用wxParse解析html
yinlell的博客
11-09 601
1.需要下载wxParse文件(点击即可下载) 2.添加到自己的工程内      3.引入wxss js wxml      1.wxss引入         @import"../../lib/wxParse/wxParse.wxss"; 2.js引入 var wxParse = require('../../lib/wxParse/wxParse.js'); 3.wxml...
微信小程序wxparse 解析markdown
09-08
微信小程序中，可以使用第三方库wxParse来解析Markdown格式的文本。wxParse可以将Markdown文本转换为小程序原生的WXML标签，实现富文本展示效果。 解析Markdown需要引入wxParse第三方库，并在小程序页面的json文件中配置： ```json { "usingComponents": { "wxParse": "/path/to/wxParse/wxParse" } } ``` 然后在wxml文件中使用wxParse组件： ```html <view class="content"> <wxParse nodes="{{mdText}}" /> </view> ``` 在该页面的js文件中，需要设置mdText为要解析的Markdown格式的文本，如： ```javascript Page({ data: { mdText: "# 标题\n正文内容" }, onLoad: function () { } }) ``` 这样，在小程序页面中就可以实现Markdown解析的效果，将Markdown文本转换为小程序原生的富文本展示。 wxParse还支持自定义样式、图片、视频等功能，可根据需要进行设置。在小程序开发中，若需展示Markdown格式的内容，wxParse是一个方便实用的解析库。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值