【需求 21402】 feat: 加入转化at评论>html字符串的指令

src/directives/index.ts

+export * from './vCommentParse'

src/directives/vCommentParse.ts

+import type { Directive } from 'vue'
+import router from '@/router'
+// 将评论内容中at 添加点击事件
+export const vParseComment: Directive = {
+  mounted(el: HTMLElement, binding: DirectiveBinding) {
+    const { value: onClickedCallback } = binding
+
+    el.querySelectorAll('span[data-id]').forEach((item) => {
+      item.addEventListener('click', () => {
+        const id = (item as HTMLElement).dataset.id
+        const isReal = (item as HTMLElement).dataset.isreal
+        if (id && isReal) {
+          console.log(id, 'id')
+          router.push(`/otherUserPage/${id}/${isReal}`)
+          onClickedCallback?.()
+        }
+      })
+    })
+  },
+}

src/main.ts

@@ -16,6 +16,8 @@ import { createNotivue } from 'notivue'
 import 'notivue/notification.css'
 import 'notivue/animations.css'
 
+import { vParseComment } from '@/directives'
+
 if (import.meta.env.MODE === 'production') {
   import('@/utils/version').then(({ loopGetVersion }) => loopGetVersion())
 }
@@ -33,6 +35,8 @@ app.use(notivue)
 app.use(createPinia())
 app.use(router)
 
+// 全局指令挂载
+app.directive('parse-comment', vParseComment)
 // 全局组件挂载
 app.component('SvgIcon', SvgIcon)
 app.mount('#app')