Javascript 引导模式不会在单击时显示

我有一个引导模式，点击就不会出现

我试过使用v-show和v-if，也试过使用$edit_user_password.modalshow；但什么都不行

导入发生在以下位置：

import EditPassword from "@/components/modals/edit_password.vue";

寄存器组件：

 components: {
    EditPassword
  },

然后我在这里的代码中使用它：

<EditPassword v-show="this.password_modal"></EditPassword>

模态如下所示：

<template>
  <div class="modal fade" id="edit_user_password" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">Update Password</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <label for="password">Update Password</label>
            <input
              type="text"
              v-model="password"
              class="form-control"
              id="password"
              placeholder="Create new password"
            >
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      password: ""
    };
  }
};
</script>

我只是坐在那里盯着代码看，不明白为什么它不工作。如果有人有任何建议，我将不胜感激。

您的选择器中缺少符号：

update_password() {
  console.log('Im clicking i promise');
  this.password_modal = true;
  $("#edit_user_password").modal("show");
}

---

我想当你选择id时忘记添加，应该是$edit\u user\u password.modalshow；

<template>
  <div class="modal fade" id="edit_user_password" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <h4 class="modal-title">Update Password</h4>
        </div>
        <div class="modal-body">
          <div class="row">
            <label for="password">Update Password</label>
            <input
              type="text"
              v-model="password"
              class="form-control"
              id="password"
              placeholder="Create new password"
            >
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      password: ""
    };
  }
};
</script>

update_password() {
  console.log('Im clicking i promise');
  this.password_modal = true;
  $("#edit_user_password").modal("show");
}