vue3で値を入れたいが入らない

Question

vue3でdomを直接操作したいです。

root.value.innerText.match(/[#＃][ぁ-んァ-ヶｱ-ﾝﾞﾟ一ー-龠*$0-9a-zA-Z]+/g)[i] = hashtag.link(`/posts/hashtag/${hashtag}`)　←ここ

※書き方むちゃ汚いのはご了承ください。
9行目でdomを直接操作してリンクを入れたいのですできません。エラーもでません。
root、hashtags、hashtag等のデータはすべて入ってることを確認しました。
何かわかる方は回答お願いします。

<template lang="pug">
hr
.data
  span.user_data
    router-link(:to="{name: 'UserPage', params: {name: e.user.name}}")
      img.avatar(:src="e.user.avatar.url")
      b {{e.user.name}}
  .right
    button(class="Box-button" @click="showBox(e.id)")
      i.fas.fa-ellipsis-h
    
    Box(v-if="boxShow == e.id" v-click-outside="closeBox")
      .boxs
        .box
          .edit-btn
            router-link.edit-btn(:to="{ path: `/posts/${e.id}/edit` }")
              i.far.fa-edit.ma-right-7
              |編集
          div.delete-btn
            button.delete-btn(v-on:click="deletepost(e.id)")
              i.far.fa-trash-alt.ma-right-7
              |削除
  div(ref="root")
    v-md-editor(:model-value="e.content" mode="preview")
</template>

<script>
import { ref, onMounted } from 'vue'

export default {
  props: {
    e: [],
  },
  setup() {
    const root = ref(null)

    onMounted(() => {
      var hashtags = root.value.innerText.match(/[#＃][ぁ-んァ-ヶｱ-ﾝﾞﾟ一ー-龠*$0-9a-zA-Z]+/g);

      for (let i = 0; i < hashtags.length; i++){
        var hashtag = hashtags[i];
        root.value.innerText.match(/[#＃][ぁ-んァ-ヶｱ-ﾝﾞﾟ一ー-龠*$0-9a-zA-Z]+/g)[i] = hashtag.link(`/posts/hashtag/${hashtag}`)
        
        console.log(root.value.innerText.match(/[#＃][ぁ-んァ-ヶｱ-ﾝﾞﾟ一ー-龠*$0-9a-zA-Z]+/g)[i])
        console.log(hashtag.link(`/posts/hashtag/${hashtag}`))
      }
    })

    return {
      root
    }
  }
}
</script>