Bootstrap-Vue Modal открывается снова, кроме ESC - PullRequest
Новая
       6

Bootstrap-Vue Modal открывается снова, кроме ESC

1 голос
/ 12 апреля 2019

В настоящее время я пишу компонент Vue для проекта.Я столкнулся с проблемой, когда модал Bootstrap-Vue снова открывается, а не закрывается.Я использую Vue.js в Версии 2.6.10 и Bootstrap 4. 

<template>
    <div>
        <b-button v-b-modal.rating-modal @click="showModal()">
            Click me
            <b-modal ref="rating-modal" no-close-on-backdrop centered title="Rate" class="rating-modal" @ok="hideModal" @cancel="hideModal" @close="hideModal">
                <div>
                    Content of the modal...
                </div>
            </b-modal>
        </b-button>
    </div>
</template>

<script>

    export default {
        name: "Rating",
        components: {
            ,
        },
        methods: {
            showModal() {
                this.$refs['rating-modal'].show();
            },
            hideModal() {
                this.$refs['rating-modal'].hide();
            },
        }
    }
    ;
</script>

Я ожидаю, что он закроется, когда я нажму кнопку отмены, хорошо или крестик в заголовке.

1 Ответ

0 голосов
/ 12 апреля 2019

Хорошо, я решил проблему самостоятельно. Все, что мне нужно было сделать, это переместить b-модальный тег из тега b-button следующим образом: 

<template>
    <div>
        <b-button v-b-modal.rating-modal @click="showModal()">
            Click me
        </b-button>
        <b-modal ref="rating-modal" no-close-on-backdrop centered title="Rate" class="rating-modal" @ok="hideModal" @cancel="hideModal" @close="hideModal">
            <div>
                Content of the modal...
            </div>
        </b-modal>
    </div>
</template>
...