vue .sync修饰符

vue组件中参数传递有个限制，就是父组件传递给子组件的变量，子组件不能直接修改，否则会有警告提示

Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "showDialog"

具体影响不影响使用，我没具体观察过。
在vue中有个.sync修饰符，具体用法是

父组件
<top-left-main :show-dialog.sync="show_dialog"></top-left-main>

子组件
<template>
<el-dialog :visible.sync="showDialog2"></el-dialog>
</template>
<script>
  export default {
    props: {
      showDialog: {
        type: Boolean,
        default: false
      }
    },
    computed: {
      showDialog2: {
        get(){
          return this.showDialog
        },
        set(val) {
          this.$emit('update:showDialog', val)
        }
      }
    }
}