el-dialog无法关闭

 代码如下，:visible.sync="result2DeptVisible"来控制dialog的隐显问题，但当点击关闭的时候 ，无法关闭！！

<el-dialog :visible.sync="result2DeptVisible" class="el-dialog-view"><el-row slot="title"><el-col>部门查询</el-col><el-row style="margin-top: 30px;" type="flex" justify="space-around"><el-input style="width: 100%;" placeholder="请输入关键字" v-model="inputBelongTo"></el-input></el-row><el-col><el-divider></el-divider></el-col></el-row><el-cascader-panel ref="result2DeptVisibleTypeRef" :options="optionsDept"@change="result2DeptVisibleBtnInterface" :props="optionsDeptMap"><!-- <template slot-scope="{ node, data }"><span>{{ data.deptName }}</span></template> --></el-cascader-panel><el-row type="flex" justify="end"><el-button :disabled="result2DeptDisable" size="mini" style="margin-right: 3px;margin-top: 20px;"type="primary" round icon="el-icon-check" @click="result2DeptTypeOneData">确定</el-button></el-row></el-dialog>

检查了一下data属性如下：

data() {return {// 遮罩层loading: true,// 选中数组ids: [],// 非单个禁用single: true,// 非多个禁用multiple: true,// 显示搜索条件showSearch: true,// 总条数total: 0,// 表格数据dataList: [],// 弹出层标题title: "",// 是否显示弹出层open: false,// 发表年度publicYear: null,inputBelongTo: null,optionsDept: [],// 查询参数queryParams: {pageNum: 1,pageSize: 10,articleName: null,bookName: null,publisherName: null,publicDate: null,isbnumber: null,result2Dept: null,wordsMinNumber: null,wordsMaxNumber: null,authorName: null,},optionsDeptMap: {checkStrictly: false,label: 'deptName',value: 'deptId',children: 'children'},result2DeptDisable: false,flowOptions: [{label: '申请人申请',value: '1'}, {label: '科研管理员审核',value: '2'}, {label: '审核通过',value: '3'}],};},

原来是data中没有定义 result2DeptVisible属性导致的。添加result2DeptVisible:false即可。

 

data() {return {// 遮罩层loading: true,// 选中数组ids: [],// 非单个禁用single: true,// 非多个禁用multiple: true,// 显示搜索条件showSearch: true,// 总条数total: 0,// 表格数据dataList: [],// 弹出层标题title: "",// 是否显示弹出层open: false,// 发表年度publicYear: null,inputBelongTo: null,result2DeptVisible:false,optionsDept: [],// 查询参数queryParams: {pageNum: 1,pageSize: 10,articleName: null,bookName: null,publisherName: null,publicDate: null,isbnumber: null,result2Dept: null,wordsMinNumber: null,wordsMaxNumber: null,authorName: null,},optionsDeptMap: {checkStrictly: false,label: 'deptName',value: 'deptId',children: 'children'},result2DeptDisable: false,flowOptions: [{label: '申请人申请',value: '1'}, {label: '科研管理员审核',value: '2'}, {label: '审核通过',value: '3'}],};},

---

总结：dom页面上使用的变量尽量按照要求在data中进行定义避免出现一些意外问题去费时排查。