Vue.js VueJS从子级更改v模型变量

我试图通过父组件更改组件的

v-model

，但我没有得到

在父组件中，我有一个

showProgress

变量，当我将其更改为

true

时，我需要它，子组件

v-model

切换为
true

ProgressModal.vue

<template>
    <v-dialog v-model="show" persistent max-width="400">
        <v-card :dark="($theme === 'dark')">
            <v-card-title class="headline" v-text="title"></v-card-title>
            <v-divider></v-divider>
            <div class="text-xs-center mt-2">
                <v-progress-circular indeterminate :size="100" :color="$color"></v-progress-circular>
                <v-card-text v-text="text"></v-card-text>
            </div>
        </v-card>
    </v-dialog>
</template>

<script>
    export default {
        name: 'progress-modal',
        props: ['title', 'text'],
        data: () => ({
            show: true
        }),
        methods: {

        }
    }
</script>


导出默认值{
名称：“进度模式”，
道具：['title'，'text']，
数据：（）=>({
秀：真的
}),
方法：{
}
}

我已经试过使用

<progress-modal v-model="showProgress">



与
v-dialog
中的
v-model
不同，它不起作用：（
要启用父级使用
v-model
，您必须在子级中定义
值
并使用它


...
导出默认值{
名称：“进度模式”，
道具：['title'，'text'，'value']，//添加了'value'
数据：（）=>({
...

这样，当您使用：



…
进度模式内的
值
将具有父级的
showProgress
值



将其命名为
show
要使用其他内部名称而不是
值
，可以在组件中使用


...
导出默认值{
名称：“进度模式”，
道具：['title'，'text'，'show']，//添加了'show'
模型：{//添加了模型选项
道具：“秀”//
},                                   //
数据：（）=>({
})，//在这种情况下，从数据中删除show
...
将
值
属性作为
值
传递到
v-dialog
组件，然后从
v-dialog
组件重新发送输入：

//CustomDialog.vue
<v-dialog :value="value" @input="$emit('input', $event)">

</v-dialog>
...
props:['value']

//CustomDialog.vue
...
道具：['value']

并将v型模型添加到父对象（自定义对话框）

//Parent.vue

如果父组件中存在
showProgress
，则您不能使用
v-model
（除非您进行一些相当高级的更改）。相反，您需要使用
prop
，并且
$emit
将任何更改返回到父组件。这是否会改变prop（即，您得到的是错误wrt mutating prop）？我没有使用最新的vue版本进行测试，但我认为
vuejs2
的实践是向父级发出值？@Traxo如果对话框是一个输入或什么的话，它会发出值。问题是
不会更改
值，所以没问题。@acdcjunior啊，你是对的，我没有注意到
持久性
选项。没有它
v-dialog
在单击外部时应更改
值，因此我认为您的示例在这种情况下无法正常工作。这是可行的；但是，这将为您提供一条“[Vue warn]：避免直接变异道具”消息：-（很好！与公认的解决方案相比，这也适用于非持久性对话框。这应该是首选解决方案。
//Parent.vue
<custom-dialog v-model="showProgress">