更新记录

3.1.0(2020-04-19) 下载此版本

解决部分设备不渲染问题,解决表格table不能定义宽度问题

支持table自定义

全局引入:@import '@/components/feng-parse/parse.css';

修改table样式修改parse.css 里面的table相关css

3.0.0(2020-03-06) 下载此版本

修复加粗后丢失空格问题,支持斜体

2.0.1(2020-02-11) 下载此版本

修复百度小程序中IOS端打包后无法渲染内容的问题 感谢反馈

查看更多

平台兼容性

20200419更新

解决部分设备不渲染问题,解决表格table不能定义宽度问题

支持table自定义

全局引入:@import '@/components/feng-parse/parse.css';

修改table样式修改parse.css 里面的table相关css

20200211更新

解决百度小程序IOS端渲染内容无法显示的问题

说明

本插件非官方!!! 由于官方的uParse虽然实现了富文本解析的大部分功能,

但是一些细节问题,并不能满足实际生产环境下的使用,

在正式的开发过程中我们遇到很多问题,并对其进行了修复,

最终得到这个可以在生产环境中直接使用的版本

为了让大家不要重复踩坑,发布供大家直接使用

后续会通过对项目的不断优化来更新这个版本

属性

属性查看官方文档 https://ext.dcloud.net.cn/plugin?id=183 这里大概写一下:

名称 类型 默认值 描述

loading Boolean false 数据加载状态

className String — 自定义 class 名称

content String — 渲染内容

noData String 数据不能为空 空数据时的渲染展示

startHandler Function 见源码 自定义 parser 函数

endHandler Function null 自定义 parser 函数

charsHandler Function null 自定义 parser 函数

imageProp Object 见下文 图片相关参数

使用方法

与官方相同,下载组件,放到components文件夹下,或直接使用HbuiderX导入插件 项目引入:

import uParse from "@/components/feng-parse/parse.vue"
export default {
        components:{
            uParse
        },
        ···········

在需要的显示位置引入:

<u-parse :content="content" @navigate="navigate"></u-parse>

示例

template

<view>
    <view class="content">
        <view class="text-area">
            <text class="title">{{title}}</text>
        </view>
    </view>
    <view class="parse-con">
        <u-parse :content="content" @navigate="navigate"></u-parse>
    </view>
    <!-- 如果是v3编译器直接使用v-html吧 -->
    <!-- <view class="parse-con">
        <view v-html="content"></view>
    </view> -->
</view>

script

import uParse from "@/components/feng-parse/parse.vue"
    export default {
        components:{
            uParse
        },
        data() {
            return {
                title: 'Hello Feng',
                content:'<em>abc123</em>'
            }
        },
        onLoad() {
            //获取你的content内容
        },
        methods: {
            navigate(e){
                console.log(e)
            }
        }
    }

关于v3编译器的问题

v3编辑器下报错:

TypeError: undefined is not an object (evaluating '_vm.node.node') 
ReferenceError: Can't find variable: getApp

在v3中会报错,推荐直接使用v-html 或关闭v3编译,后续会修复这个问题,如果大家有什么好的办法,可以留言告诉我。

需要交流加微信吧,预览图上那个二维码,或者加wx:semfeng

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问