亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

“vb-modal”和“vb-toggle”指令不能一起工作

“vb-modal”和“vb-toggle”指令不能一起工作

幕布斯6054654 2021-11-18 16:03:02
使用此按鈕選項只能使用v-b-toggle指令。如果評論其中之一(v-b-modal或v-b-toggle)一切正常(例如,如果評論切換指令,模態指令開始工作)<b-button    v-for="button in headerButtons"    :key="button.name"    :variant="button.variant"    :class="`${button.class} mr-4`"    v-b-modal="button.modalId"    v-b-toggle="button.collapseId">{{ button.name }}</b-button>數據:headerButtons: [    {        name: "btn 1",        variant: "success",        class: "green",        modalId: "new-exchange-modal"    },    {        name: "btn 2",        variant: "info",        collapseId: "search-collapse",        class: "blue"    }]需要做什么才能使所有指令都有效?筆記!在熱重載(webpack)之后它運行良好(每個指令都可以很好地協同工作)
查看完整描述

1 回答

?
翻閱古今

TA貢獻1780條經驗 獲得超5個贊

您應該切換到僅使用所需指令的條件呈現按鈕。這兩個指令相互沖突(主要是由于添加到觸發按鈕的 ARIA 標記不同)。


改為這樣做:


<tempate v-for="button in headerButtons">

  <b-button

    v-if="button.modalId"

    :key="button.name"

    :variant="button.variant"

    :class="`${button.class} mr-4`"

    v-b-modal="button.modalId"

  >{{ button.name }}</b-button>

  <b-button

    v-else-if="button.collapseId"

    :key="button.name"

    :variant="button.variant"

    :class="`${button.class} mr-4`"

    v-b-toggle="button.collapseId"

  >{{ button.name }}</b-button>

</template>

https://github.com/bootstrap-vue/bootstrap-vue/issues/4243


查看完整回答
反對 回復 2021-11-18
  • 1 回答
  • 0 關注
  • 308 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號