专业编程基础技术教程

网站首页 > 基础教程 正文

uniapp的rich-text组件 动态注入的html代码,a标签不能点击跳转

ccvgpt 2024-10-17 08:56:48 基础教程 8 ℃

官方api:https://uniapp.dcloud.io/component/rich-text.html


uniapp的rich-text组件 动态注入的html代码,a标签不能点击跳转


富文本<rich-text>标签提供了拦截点击事件@itemclick,可以拦截点击事件(只支持a、img标签),返回当前节点信息。

<rich-text :nodes="mcontent" @itemclick="itemclick"></rich-text>

1、项目中,富文本中a跳转实例子

itemclick(e){
				var that=this;
				let item = e.detail.node;
				console.log(item);//打印可以看到数据具体内容
				if (item.name == "a") {
					console.log('a');
					that.handleLink(item.attrs.href);
				}
				else{
					console.log('img');
				}	
},
  
  // 点击跳转
 handleLink(itemlink) {
    location.href = itemlink;
 },



保存图片事件,参考原文网址:
https://blog.csdn.net/qq_42460461/article/details/122430436

Tags:

最近发表
标签列表