modal窗有沒有可能在點(diǎn)擊時(shí)再生成創(chuàng)建？

左邊第一列灰色的按鈕是在生成頁面的時(shí)候通過vue和bootstrap-vue組件挨個(gè)生成綁定的，代碼如下：

<template>
  <div>
    <b-btn v-b-modal="modalWindowId">{{ namedPipelineName }}</b-btn>
    <b-modal :id="modalWindowId" size="lg">
      Hello From My Modal!
    </b-modal>
  </div>
</template>

<script>
  export default {
    name: 'pipeline-detail-modal',
    props: ['namedpipeline'],
    data () {
      return {
        modalWindowId: this.namedpipeline.id,
        namedPipelineName: this.namedpipeline.series.name
      }
    }
  }
</script>

我的問題有兩個(gè)

１. 這些幾乎相同的modal窗，單頁面數(shù)據(jù)達(dá)到幾百行的時(shí)候會不會是很大額外開銷
２. 如果是的話，有什么好的優(yōu)化方案？