【uniapp】富文本点击事件

背景 : 接到需求,需要给app内的富文本增加点击事件进行界面跳转,原来我们只是使用的 标签渲染富文本

实现

使用第三方插件地址: uParse 富文本解析 - DCloud 插件市场 https://ext.dcloud.net.cn/plugin?id=183#detail

插件引入到项目
在这里插入图片描述

	import uParse from '@/components/u-parse/u-parse.vue';

	components: {
		uParse
	},
	
	data(){
		return {
			article: `<a href='/pages/player/player1?title=名称&id=id&packId=learnTypeId&type=7'>我是a标签</a>`,
		}
	}

	navigate(url, e) {
		console.log('url', url); // /pages/player/player1?title=名称&id=id&packId=learnTypeId&type=7
		conso.log(e)
		uni.navigateTo({
			url:'/pages/player/player3?id=1309&packId=237'
		})
	},
	<view class="swiper-item-text swiper-item-text1">
		<u-parse :content="article" @preview="preview" @navigate="navigate"></u-parse>
	</view>

参考博主原文 : https://zhuanlan.zhihu.com/p/554786156

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值