【AntDesign】Modal模态窗带来的缓存问题

背景 : 使用antdesign modal写模态窗, 列表点击"编辑"可以打开模态窗, 并对里面的文字和图片进行修改

问题 : 每次关闭模态窗后, 点击其他数据进行修改, 会发现图片这栏有时候有数据, 有时候会为空, 明明已经传了imgUrl过来了。

modal模态窗具有缓存问题,也就是关闭的时候其他它并没有真正被销毁掉,包括它里面的数据,即使关闭的时候我已经清空了数据,再次打开时重新赋值,有时也会出现缓存问题。这不仅会影响modal里面的数据,更会影响到modal里面组件的

解决:

在modal上加上这个属性 destroyOnClose={true}, 即关闭时销毁该组件

javascript 复制代码
	<Modal
        centered
        title={tableTitle}
        width={200}
        height={500}
        visible={visible}
        onOk={onSubmitFn}
        onCancel={handleAccessmentCancel2}
        destroyOnClose={true}
      >
      </Modal>
相关推荐
hollyhuang16 分钟前
正则校验:校验只能输入数字且首位不能是0
前端
一室易安18 分钟前
模仿elementUI 中Carousel 走马灯卡片模式 type=“card“ 的自定义轮播组件 图片之间有宽度
前端·javascript·elementui
脸大是真的好~27 分钟前
黑马JAVAWeb -Vue工程化 - Element Plus- 表格-分页条-中文语言包-对话框-Form表单
前端·javascript·vue.js
一个小潘桃鸭31 分钟前
记录:echarts tooltip内容过多时,会导致部分内容遮挡
前端
小满zs41 分钟前
Next.js第四章(路由导航)
前端
进击的野人43 分钟前
深入理解 CSS4 新特性:CSS 变量
前端·css
DevUI团队44 分钟前
🚀 MateChat发布V1.10.0版本,支持附件上传及体验问题修复,欢迎体验~
前端·vue.js·人工智能
用户345848285051 小时前
Vue是怎么实现双向绑定的
前端
彩虹下面1 小时前
手把手带你阅读vue2源码
前端·javascript·vue.js
华洛1 小时前
经验贴:Agent实战落地踩坑六大经验教训,保姆教程。
前端·javascript·产品