vue 拦截 v-html 中 a 标签 href 跳转

记录

template 中 给需要 拦截的 代码片段加上click 方法 @click="targetNodeNameClick"

html 复制代码
 <p class="message-content message-content-text" v-html="replaceURLWithHTMLLinks(getText(message))"  @click="targetNodeNameClick"></p>

然后方法的代码:如有参考,有业务代码自行理解。

javascript 复制代码
// 拦截 v-html 中 a 标签 href 跳转
targetNodeNameClick(event) {
  if (event.target.nodeName == "A") {
    event.preventDefault();
    // 使用浏览器打开
    let url = event.target.getAttribute('href')
    if (url) {
      if (url && url.substring(0, 1) === '/') {
        url = `${process.env.VUE_APP_BASE_URL}${url}`
      }
      this.$ipcInvoke(ipcApiRoute.openDefaultBrowser, url)
    }
    return false
  }
},
相关推荐
用户461169657282 小时前
网站 HTTPS 不稳定?证书排查指南
前端
n87652 小时前
Playwright Java WEB UI 自动化实现框架与逻辑
java·前端·ui
keyipatience2 小时前
TypeScript学习(1)
前端·javascript·学习·typescript·html·css3
xifangge20253 小时前
基于 JavaScript 实现 CNC 数控切削参数与螺纹公差纯前端核算引擎
开发语言·前端·javascript
wangruofeng3 小时前
2026 Web 技术选型指南,AI 时代如何选择适合项目的技术栈
前端·aigc·ai编程
honkun63 小时前
vue 表格组件 vxe-table 修改滚动条样式,修改滚动条样式,统一宽度、颜色与自动隐藏
前端·javascript·vue.js
爱勇宝4 小时前
研究数字孪生的这半年,做了个 Demo,也有了一些新想法
前端·程序员
不可能片场4 小时前
工程实践 一个缓存把选片从十分钟压到一分钟
前端·electron
前端小万4 小时前
探索副业五个月,最终以放弃告终
前端·后端·面试
FRing034 小时前
JavaScript入门到精通二十四(正则表达式、元字符、修饰符)
开发语言·前端·javascript·正则表达式