相关疑难解决方法(0)

我正在使用Vue.js 2.1.10和Bootstrap 3.3.7来显示打开另一个模式对话框的模式。每个模式对话框都包含在不同的组件中。在第一个组件内部，有对第二个组件（select-travler）的引用。

根据Bootsrap文档，我必须通过监听事件来设置焦点shown.bs.modal。将焦点设置在第一个模态中包含的输入控件上非常有用。问题：当模态在另一个模态之上时，这种方式不起作用。

第一个模态组件如下所示：

<template>
    <div ref="tripEdit" class="modal fade" role="dialog">
        <!-- Inbeded component -->
        <select-travler ref="selectTravler"></select-travler>
        <!-- /Inbeded component -->

        <div class="modal-lg modal-dialog">
            <div class="modal-content">
                <div class="modal-body container form-horizontal">

                    <div class="form-group">
                        <label for="travler_name" class="control-label">
                            Travler's name
                        </label>
                        <input id="travler_name" ref="travler_name"
                            v-model="travler_name"/>
                    </div>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
    export default {
        data () {
            return {
                travler_name: null,
            }
        },

        methods: {
            show (operationType) {
                $(this.$refs.tripEdit).modal('show');

                let that = this;
                $(this.$refs.tripEdit).on('shown.bs.modal', …