vue弹窗只有第一次加载会有数据

问题描述:

使用 el-dialog 去做弹窗,弹窗是个组件,点击弹窗之后,在弹窗里面去调用接口,接口不管是写在 mounted() 还是 created() 首次都可以调用,但是关闭弹窗之后,再打开就不能调用了

原因分析:

第一次弹出弹窗,弹窗页面需要初始化数据,这时候第一次会去调用写在 mounted() 或者 created()里面的方法

关闭弹窗后,el-dialog是通过v-show也就是display:none去控制,弹窗并没有销毁,所以在下次打开,只是display 变成了 block,但是弹窗的生命周期已经运行过,mounted() 和 created() 在生命周期里面都是只执行一次,所以第二次不调用

解决办法:

在el-dialog里面加上v-if

<el-dialog
    v-if="isShow"
    title="弹窗"
    :visible.sync="isShow"
    width="934px"
     :before-close="(done) => { done() }"
 >
    ...

</el-dialog>

猜你喜欢

转载自blog.csdn.net/qq_44782585/article/details/118935919