深山工作室

深山工作室 >

uniapp的rich-text组件注入的a标签点击跳转处理

关于rich-text组件动态注入的HTML代码中包含a标签 不能点击跳转

以下是有问题的部分
nodes: [{
name: 'div',
attrs: {
class: 'div-class',
style: 'line-height: 60px; color: red; text-align:center;',
onclick: 'javascript:alert(222)'
},
children: [{
type: 'text',
text: 'Hello uni-app!'
}]
这样注入onclick事件也执行不了。。。。rich-text组件

解决方法:

可以将rich-text组件换成uParse组件,uParse组件可以实现动态注入a标签跳转

<uParse :content="strings" @preview="preview" @navigate="navigate" />

navigate就是点击跳转方法

在method中加上navigate函数:

navigate(href, e) { 
    //比如点击a标签,打开某个webview并传输url 
     uni.navigateTo({ 
        url: '/pages/goodsDetail/webView?url=' + href 
     }) 
}

前一页:uni-app自定义组件调用
后一页:vue uni-app判断空字符串/null/undefined或者有误字段
相关阅读
没有相关的信息加入
更多>>uni-app相关信息
uni-app开发表单input组件的一些规则说明自己预留使用
uni-app:使用uni.downloadFile下载word或pdf文件并保存到手机
小程序中利用addPhoneContact将联系人的信息添加到手机通讯录支持保存联系人头像
微信小程序打开客服提示:该小程序提供的服务出现故障,请稍后重试
微信小程序客服会话只能过button让用户主动触发
更多>>最新添加
dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT
Android移动端自动化测试:使用UIAutomatorViewer与Selenium定位元素
抖音直播音挂载小雪花 懂车帝小程序
javascript获取浏览器指纹可以用来做投票
火狐Mozilla Firefox出现:无法载入您的Firefox配置文件 它可能已经丢失 或是无法访问 问题解决集合处理办法