uni-app+vue3 开发小程序渲染富文本点击a标签跳转路径，怎样实现？

Question

uni-app+vue3 开发小程序，渲染富文本并点击其中的a标签，跳转到小程序内路径

<rich-text :nodes="strings" @click="hal"></rich-text>

let content =
    '<div class="brief-content-sub"><a href="/about_205/" >111</a><a href="/about_205/">222</a></div>';
  let contents = content.replace(
    /<a[^>]+href="([^"]+)"[^>]*>(.*?)<\/a>/g,
    (match, url, text) => {
      let href_s = url.slice(-4, -1);
      return `<a data-id="${href_s}" data-type="ss" class="a">${text}</a>`;
    }
  );
// 这个方法取不到data-id和data-type
const hal = (e) => {
  console.log(e);
  var href = e.target.dataset.url;
  console.log("点击的元素的id是：" + href);
  // if (href) {
    wx.navigateTo({
      url: "pages/zzjg/hydbdh",
    });
  // }
};

使用js思路完成大概这样 但是小程序里dom相关的方法无法监听

watch(strings, async () => {
  nextTick((strings) => {
    let ss = document.getElementsByClassName("a");
    console.log(ss);
    for (let i = 0; i < ss.length; i++) {
      ss[i].addEventListener("click", function () {
        let href_s = ss[i].href.slice(-4, -1);
        if (href_s == 205) {
          uni.navigateTo({
            url: "/pages/zzjg/hydbdh",
          });
        }
      });
    }
  });
});

求助大佬 还有其他办法吗