Javascript VueJS组件数据未更新

我已经遇到VueJS问题好几个小时了，需要帮助

我有一个带有HTML字符串的变量。我想通过JS操作这个字符串。在某个牢房里画一个徽章。 但任何变化都不会被接受。我不知道为什么

<template>
  ...
  <div class="html-wrapper" id="file">
     <div v-html="htmlCode"></div>
  </div>
</template>

<script>
  ...
  methods: {
    redrawBadges() {
          var vmThis = this;
          this.scripts.forEach(s => {
            if(s.target != '')
              if(document.getElementById(s.target) != null) {
                let badge = s.html;
                let idIndex = vmThis.htmlCode.indexOf('id="'+ s.target +'"');
                let tdEnd = vmThis.htmlCode.indexOf('>', idIndex);
                vmThis.htmlCode = vmThis.htmlCode.splice(tdEnd + 1, 0, badge);
                console.log(vmThis.htmlCode.slice(0));
              }
          });
    }
  },
  ...
</sciprt>

...
...
方法：{
重新绘制徽章（）{
var vmThis=这个；
this.scripts.forEach（s=>{
如果（s.目标！=''）
if（document.getElementById（s.target）！=null）{
让badge=s.html；
让idIndex=vmThis.htmlCode.indexOf（'id=“”+s.target+”）；
设tdEnd=vmThis.htmlCode.indexOf（'>'，idIndex）；
vmThis.htmlCode=vmThis.htmlCode.splice（tdEnd+1,0，标记）；
log（vmThis.htmlCode.slice（0））；
}
});
}
},
...

控制台输出正确的字符串。但是，组件不会显示它。即使使用Vue DevTools，我也看不出字符串是否已更改。

使用

Vue.set（对象、属性名称、值）

这将帮助您解决问题。

使用

Vue.set（对象、属性名称、值）

---

这将帮助您解决问题。

如果可能，您是否可以共享相同的链接（）是在

数据中声明的一个字段
htmlCode
？是的，它在数据中定义，并获取一个属性的值刚刚托管在Stackblitz上，无法重现那里的问题。我将不得不再次分析它……也许，您不应该直接为数据变量指定prop值。尝试通过
mount
hook@phil795初始化
htmlCode
值，如果可能，您可以共享相同的链接（）是在
数据中声明的
htmlCode
字段吗？是的，它在数据中定义，并获取属性的值刚刚在Stackblitz上托管，无法重现那里的问题。我将不得不再次分析它……也许，您不应该直接为数据变量指定prop值。尝试通过
mount
hook@Phil795With
Vue.set（）
初始化
htmlCode
值。问题持续存在
Vue.set（）