亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

<p>In my component, I have three popup modals with different content. By clicking on a specific button, I need to open the corresponding popup modal. </p> <p>This is what I'm doing <strong>For button 1 -</strong></p> <pre class="brush:php;toolbar:false;"><s-button type="button" class="bl_btn" @click="onClickProdOpen"> Product Details </s-button></pre> <p><strong>For this modal 1 will be </strong></p> <pre class="brush:php;toolbar:false;"><s-modal v-model="isShowPopup1" :title="$t('LBL_PROD_CONT')" <my-component-one :pageId ="this.$options.name" :popupDefaultTab="popupOpenDefaultTab" :onClickClose="onClickclose" /></pre> <p><strong>Here is a button click method. Click events for multiple different modal boxes like this. </strong></p> <pre class="brush:php;toolbar:false;">methods: { onClickProdOpen() { this.isShowPopup1 = true; this.popupOpenDefaultTab = 0; } }</pre> <p><s-modal is the custom modal box part, the content will be different. So, I repeated this modal code and just changed the content, i.e. passed different child components (MyComponentOne, MyComponentTwo...). </p> <p>So, how can I use a switch case statement to avoid repeating the modal box code multiple times and just change the inner content component? Any suggestions will be helpful. </p>

<b-modal v-model="modal_states[1]">模態(tài)框1</b-modal>
    <b-button @click="openModal(1)">打開1</b-button>
    
    <b-modal v-model="modal_states[2]">模態(tài)框2</b-modal>
    <b-button @click="openModal(2)">打開2</b-button>
    
    <b-modal v-model="modal_states[3]">模態(tài)框3</b-modal>
    <b-button @click="openModal(3)">打開3</b-button>

data: {
    modal_states: {},
  },
  methods: {
    openModal(index){
      this.modal_states = {[index.toString()]:true}
    }
  },