dialog彈窗優雅寫法
阿新 • • 發佈:2020-08-19
<!-- -----彈窗------ --> <new-adddialog :dialog-visible.sync="newAddvisible"></new-adddialog> data() { return { treeData: [], defaultProps: { children: 'childNodes', label: 'name', isLeaf: 'leaf', }, filterText: '', // 彈窗 tableData: [], newAddvisible:false, //新增彈窗 loading: false, method:{ // 新增 newAddclick(){ this.newAddvisible = true } } 子元件 props: { dialogVisible: { type: Boolean, require: true, default: false }, subTaskInfo: { type: Object, default: () => { return {} } }, 通過'update:dialogVisible',可以實時更新父元件的newAddvisible的值<span slot="footer" class="dialog-footer"> <el-button @click="()=>{this.$emit('update:dialogVisible', false)}">取 消</el-button> <el-button type="primary" @click="dialogVisible = false">確 定</el-button> </span>