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
  }
},
相关推荐
Jutick2 分钟前
揭秘低延迟:WebSocket 实时行情如何拯救你的量化策略?——Python 生产级实现
前端
~欲买桂花同载酒~3 分钟前
项目优化-vite打包优化
前端·javascript·vue.js
林夕sama5 分钟前
多线程基础(五)
java·开发语言·前端
我叫蒙奇9 分钟前
husky 和 lint-staged
前端
kyriewen10 分钟前
JavaScript 继承的七种姿势:从“原型链”到“class”的进化史
前端·javascript·ecmascript 6
穷鱼子酱13 分钟前
ElSelect二次封装组件-实现分页(下拉加载、缓存)、回显
前端
科科睡不着14 分钟前
拆解iOS实况照片📷 - 附React web实现
前端
前端老兵AI15 分钟前
Electron 桌面应用开发入门:前端工程师的跨平台利器
前端·electron
胖子不胖16 分钟前
浅析cubic-bezier
前端
reasonsummer21 分钟前
【办公类-133-02】20260319_学区化展示PPT_02_python(图片合并文件夹、提取同名图片归类文件夹、图片编号、图片GIF)
前端·数据库·powerpoint