keep-alive解决二级页面数据不清空问题

文章讨论了在项目中遇到的二级页面数据在提交后未清空的问题,原因在于二级页面没有重新加载,onMouted生命周期方法只执行一次。解决方案是确保在二级页面打开时重新执行生命周期,例如在组件的show属性改变时。示例代码展示了如何在Vue组件中实现这一操作,利用<keep-alive>和v-if来控制页面的状态。
摘要由CSDN通过智能技术生成

二级页面数据不清空


做项目提交表格的时候提交完重新打开二级页面数据没有清空,
在这里插入图片描述

为什么会出现这问题,是因为二级页面在二次被打开的时候没有被重新加载,onMoubted只在以及页面执行一次,二级页面执行一次,二级页面关闭后重新打开并没有重新加在,只是页面的显示隐藏状态被修改了,想解决此类问题的一个方法就是在页面打开后让二级页面重新执行一下生命周期。

<my-window
    ref="addModify"
    :title="title"
    :show="popShow"
    :full="false"
    :customFooter="false"
    @handleOk="add()"
    @close="LOSEDIA()"
    :customClass="'diaBodyNotFull'"
  >
    <template #custom>
      <keep-alive>
      <div class="popInfo" v-if="popShow">
      </div>
    </keep-alive>
    </template>
  </my-window>

这样就解决问题了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值