无法在 vuejs 中捕获“hidden.bs.modal”

Question

我在 Laravel 项目中使用 vue.js，但它无法捕获 hidden.bs.modal 事件。

在laravel-mix 中使用autoload 并在vue.js 中捕获hidden.bs.modal 时会出现此问题。 （出vue.js就可以了）

混合文件

mix
.autoload({
    'jquery': ['$', 'window.jQuery', 'jQuery'],
    'moment': ['moment','window.moment'],
})
...

当使用包pc-bootstrap4-datetimepicker和laravel-mix时，我必须使用autoload来解决问题。

Vue 文件

<template>
    <div id="my_modal"
         class="modal"
         tabindex="-1"
         role="dialog"
         aria-hidden="true"
         ref="my_modal">
        ...
    </div>
</template>

<script>
    export default {
        mounted() {
            $(this.$refs.my_modal).on('hidden.bs.modal', this.doSomething);
        },

        methods: {
            doSomething() {
                // Do something
            },
        },
    }
</script>

所以如果我从webpack.mix.js 中删除autoload，我就可以捕捉到这个事件。但是包pc-bootstrap4-datetimepicker 将不起作用。发生什么了？谢谢。

Answer 1

你可以这样抓住它

<div ref="myModalRef"></div>

$(this.$refs.myModalRef).modal('hide')

或

$(this.$refs.myModalRef).modal('show')

但它会给你 console.log 错误，因为它使用 JQuery.... 我仍然没有找到答案，但当我知道时我会告诉你