Vuejs2 使用laravel+；中的模式查看用户信息；vuejs

有人能帮我吗？ 我是vuejs新手，在vuejs中使用modal时遇到问题。 我的问题是单击“显示用户”按钮，模式没有弹出

这是我的ShowUser vue组件

<template>

    <div class="modal fade" v-bind:class="{ 'is-active':modalState }">
            <div class="modal-dialog" role="document">
                    <div class="modal-content">
                            <div class="modal-header">
                                    <h5 class="modal-title">Modal title</h5>
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                            <span aria-hidden="true">&times;</span>
                                    </button>
                            </div>
                            <div class="modal-body">
                                    ...
                            </div>
                            <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                    <button type="button" class="btn btn-primary">Save changes</button>
                            </div>
                    </div>
            </div>
    </div>

---

您可能希望使用

数据目标

切换模式：

User.vue

<button type="button" class="btn btn-info btn-sm fa fa-eye" 
        data-toggle="modal" 
        data-target="#myModal"
        @click="handleActionButton">
  Launch demo modal
</button>

<template slot="actions" slot-scope="props">
   <button class="btn btn-info btn-sm fa fa-eye" @click="handleActionButton"></button>
   <ShowUser></ShowUser>
</template>

import ShowUser from '../views/setup/users/ShowUser'

export default new Router ({
routes : [
  {
    path: 'users/:id',
    name: 'ShowUser',
    component: ShowUser,
    props: true   
 }
]
})

<button type="button" class="btn btn-info btn-sm fa fa-eye" 
        data-toggle="modal" 
        data-target="#myModal"
        @click="handleActionButton">
  Launch demo modal
</button>

<template>

    <div class="modal fade" 
         v-bind:class="{ 'is-active':modalState }" 
         id="myModal">
    </div>

</template>

handleActionButton() {
  $('#myModal').modal('show')
  this.modalState = true
}