<transfer-component
:visible.sync="transferVisible"
></transfer-component>
通过transferVisible来控制组件的显隐
在组件中
<template>
<el-dialog class="transferDialog"
title="工单转接"
:visible.sync="visible"
:close-on-click-modal="false"
center>
// ...
<el-row slot="footer">
<el-button @click="$emit('update:visible', false)">取消</el-button>
visible作为组件的props存在
此时, 直接点击右上角的关闭按钮会报错, 没有截图, 大概就是说父组件每次render都会覆盖子组件props中visible属性的值,所以 visible 应该作为data或computed中的属性, 而不是props
直接点击右上角的关闭按钮时没有通知到父组件去改变visible
试着在@close事件中通知父组件,但还是一样的报错
正确做法是在beforeClose方法中通知父组件去改变visible的值
需要注意的地方
1, beforeClose的写法是
:before-close="beforeClose"
它是一个方法,但前面用的引号 : 而不是@(...)
2, 它只接受函数名,不接受js语句