Javascript v-once在模板上渲染两次

我用它在一个页面上显示消息，该页面提供关于该项目的信息，但当我单击表上显示的按钮（按钮显示在每行上）时，每行中的所有按钮都被单击，因此它使

b-modal

显示了一行中每个按钮的多次。我添加了

v-once

，但

b-modal

的渲染次数仍然是表中可用按钮的两倍或两倍

这是我的HTML

  <template slot="action" slot-scope="data">
     <b-btn v-b-modal.modal2 variant="primary">View</b-btn>

      <b-modal v-once id="modal2" size="lg" title="View Surat">
        <p class="my-2">View Surat</p>
      </b-modal>
  </template>

看法
查看Surat

---

这里，我的完整

.vue
v-once
的工作方式与您期望的不同它不仅向dom中添加了一次元素相反，
v-once
所做的是只渲染一次sepcific组件的模板，它说：

在后续重新渲染时，元素/组件及其所有子级
将被视为静态内容并跳过。这可以用来
优化更新性能

但是，这不是对同一元素的重新渲染，它不会停止将
b-modal
附加到dom多次的实现

我建议的一种可能的解决方法是在父级组件数据中使用一个变量来确定模态是否已打开，并使用按钮上的方法触发它，如下所示：

  <template slot="action" slot-scope="data">
     <b-btn @click="openModal" variant="primary">View</b-btn>

      <b-modal :active.sync="isOpen" size="lg" title="View Surat">
        <p class="my-2">View Surat</p>
      </b-modal>
  </template>

公平地说，我还没有在life项目中测试过这一点，但从中可以看出，这应该会给您带来预期的行为。
很抱歉，很长时间没有回复，我忘记了数组的索引。它现在是这样工作的
v-b-modal.modal（“$index”）
data() {
   return {
     // your other data
     isOpen: false
   }
},
methods: {
  openModal () {
    this.isOpen = true
   }
}