无涯教程网

Vue.js vuetify：以编程方式显示对话框

发布于06月09日

vuetify说:如果您想以编程方式打开或关闭对话框，可以使用带有布尔值的v-model.

然而，我不清楚这意味着什么.说"使用v型"充其量只是含糊其辞.父组件在安装时知道它是否应该打开，但我不清楚如何在子组件中动态更改它.我应该用v-bind通过吗？

<login v-bind:showDialog></login>

如果是，子组件如何处理这个问题？

Vuetify对话框信息:https://vuetifyjs.com/components/dialogs

推荐答案

v-model是一个指令.你会用v-model，而不是v-bind.

你链接的页面有几个例子.如果你点击第一个按钮上的<>，它会显示HTML源代码

<v-dialog v-model="dialog">

v-model在组件内部名为value的props 上进行双向绑定.将绑定变量的值设置为true时，将显示对话框；当false时，它会隐藏起来.此外，如果对话框被取消，它会将变量的值设置为false.

Vue.js相关问答推荐

Vue 3组合式API如何测试是否发出正确的事件

vue 3 中范围样式和深度样式的问题

nuxt.js auth 始终重定向到登录，而不是允许转到带有 auth： false 的页面，

Nuxt3-Vue中的useRoute和useRouter有什么区别

禁用 vue-cli webpack 编码图像 base64

使用 Laravel 作为后端刷新 Vue.js SPA 的身份验证令牌

Vue 两种方式的 prop 绑定

eslint – 如何知道 defined定义规则的位置

为什么 CSS 关键帧动画在具有范围样式的 Vue 组件中被 destruct ？

VueJS + Typescript：类型上不存在属性

如何在nuxt路由中添加meta？

即使在客户端设置 Access-Control-Allow-Origin 或其他 Access-Control-Allow-* 标头后也出现 CORS 错误

如何使用 vuex 删除项目？

不需要提交Mutations的 vuex 操作

Vue 组件 Vue-Instant

是否可以从 vue-devtools 中排除 vue 事件和 vuex Mutations？

我应该将所有数据存储在 vuex 状态

如何在 JEST 测试中模拟全局 Vue.js 变量

如何使用 Vuetify 验证复选框组

vue-router 如何使用 hash 推送({name："question"})？

实用课程推荐

相关教程推荐