React-ant-design关于Modal中Confirm内部中this指向问题
发布日期:2021-05-20 10:06:18
浏览次数:18
分类:技术文章
本文共 1863 字,大约阅读时间需要 6 分钟。
1、 这是官方组件代码,这里需要注意的是
在confirm中,this指向永远在其内部中
,这就是容易踩坑的点。 confirm({ title: 'Do you want to delete these items?', content: 'When clicked the OK button, this dialog will be closed after 1 second', onOk() { return new Promise((resolve, reject) => { setTimeout(Math.random() > 0.5 ? resolve : reject, 1000); }).catch(() => console.log('Oops errors!')); },
2、以失败的案例为例,错误写法
// 恢复列表数据 handlerecoverList = () => { Modal.confirm({ title: '确认删除吗', okText: '确认', cancelText: '取消', onOk() { //代码执行到这里的时候就会出错了 const { selectedRows } = this.state; const { dispatch } = this.props; const idList = []; selectedRows.forEach((item) => { const id = item.registrationId; idList.push(id); }) if (idList.length === 0) { message.error('请先勾选数据') } dispatch({ type: 'recycleBin/batchRecoverList', payload: { registrationIdList: idList, }, }).then(() => { this.getPageList() }); } }); }
3、正确写法是
const _this = this;
// 恢复列表数据 handlerecoverList = () => { //注意这里写法 const { selectedRows } = this.state; const { dispatch } = this.props; const _this = this; Modal.confirm({ title: '确认删除吗', okText: '确认', cancelText: '取消', onOk() { const idList = []; selectedRows.forEach((item) => { const id = item.registrationId; idList.push(id); }) if (idList.length === 0) { message.error('请先勾选数据') } dispatch({ type: 'recycleBin/batchRecoverList', payload: { registrationIdList: idList, }, }).then(() => { _this.getPageList() }); } }); }
转载地址:https://blog.csdn.net/weixin_45416217/article/details/103781355 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!
发表评论
最新留言
网站不错 人气很旺了 加油
[***.192.178.218]2024年04月19日 21时32分22秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
木兰编程语言入门教程之三——函数和类型
2019-04-26
基于「木兰」逆向工程用 pyinstaller 生成可执行文件
2019-04-26
从微盟事件看商业数据公开化的必然趋势
2019-04-26
为新语言编写Visual Studio Code语法高亮插件
2019-04-26
手机编程环境初尝试-用AIDE开发Android应用
2019-04-26
Java关键字的汉化用词探讨
2019-04-26
程序员面试时用中文命名写白板代码的好处
2019-04-26
1992年日本对母语编程的可读性比较实验
2019-04-26
[转] 用python编写控制网络设备的自动化脚本3:启动
2019-04-26
扩展Python控制台实现中文反馈信息
2019-04-26
扩展Python控制台实现中文反馈信息之二-正则替换
2019-04-26
在PyPI测试平台发布Python包
2019-04-26
中文代码示例之Electron桌面应用开发初体验
2019-04-26
中文代码示例之NW.js桌面应用开发初体验
2019-04-26
为《 两周自制脚本语言 》添加中文测试代码
2019-04-26
将《 两周自制脚本语言 》测试中使用的接口中文化
2019-04-26
5分钟入门LingaScript-尝鲜中文版TypeScript
2019-04-26
重拾《 两周自制脚本语言 》- 支持中文标识符
2019-04-26
Java实现文本编辑时基于拼音输入的补全原型
2019-04-26