Vuetify v-dialog 未显示，没有错误答案

【问题标题】：Vuetify v-dialog not showing, no errorsVuetify v-dialog 未显示，没有错误
【发布时间】：2020-12-11 02:15:29
【问题描述】：

我正在尝试使用 Vuetify 为我的 Vue.js 前端实现一个简单的对话框。 v-dialog 组件不能正常工作，当 v-model="dialog" 设置为 true 时，屏幕会变暗，但里面的对话框没有显示，你可以在这里看到：https://imgur.com/K977VoS

代码是从这里简单复制的：https://github.com/vuetifyjs/vuetify/blob/master/packages/docs/src/examples/dialogs/usage.vue 只添加到模板中。

这是一个以 Vue.js 作为前端并带有 vuetify 的 Laravel 项目。我已经实现了功能齐全的 vuetify 日历，一切都很好，但是这个。我想添加一个带有对话框的新事件并获得相同的深色页面。

我的 vuetify.js 配置：

import '@mdi/font/css/materialdesignicons.css' // Ensure you are using css-loader
import Vue from 'vue'
import Vuetify from 'vuetify'

Vue.use(Vuetify)
import "vuetify/dist/vuetify.min.css";
import cs from 'vuetify/es5/locale/cs'
// import 'material-design-icons-iconfont/dist/material-design-icons.css'

const opts = { lang: {
    locales: { cs },
    current: 'cs',
    iconfont: 'mdi'
  },}

export default new Vuetify(opts)

我的 app.js 主文件：

require("./bootstrap");
window.Vue = require("vue");

import Vuetify from "../plugins/vuetify";

//...

const app = new Vue({
    store: store,
    el: "#app",
    vuetify: Vuetify
});

【问题讨论】：

就像我说的，代码是从vuetify官方复制过来的，但是我加了一个jsfiddle：jsfiddle.net/dbL4aqse

标签： javascript vue.js vuetify.js

【解决方案1】：

我遇到和你一样的问题，但是我的问题是因为我设置了v-dialogv-model='true':

v-model 的值可以从一开始就设置为 true。当在 Vue 中全局注册严格用于 Dialog 目的的组件时，这很有帮助。当调用组件激活注册的对话框组件时，我希望对话框的 v-model 从一开始就为真。

Source

我不知道这是否有帮助，但它解决了我的问题。

【讨论】：