antd中的message.loading
今儿遇到一个需求问题,在table中的操作栏点击删除,由于是向后端发起请求,所以需要一个loading效果,loading又是使用的antd中的message.loading()。
如下是antd中提供的写法
import { message, Button } from 'antd';
const success = () => {
message
.loading('Action in progress..', 2.5)
.then(() => message.success('Loading finished', 2.5))
.then(() => message.info('Loading finished is finished', 2.5));
};
ReactDOM.render(<Button onClick={success}>Display sequential messages</Button>, mountNode);
我自己在业务中的写与其大同小异
const loading = message.loading('删除中...');
action
.del(id)
.then(()=>{
loading;
})
.then(() => {
message.success('删除成功');
})
.catch(() => {
message.error('删除失败');
});
但是这样写语法会报错,如下
React | Expected an assignment or function call and instead saw.....
然后只能又改写法
message.loading('删除中...');
action
.del(id)
.then(() => {
message.success('删除成功');
})
.catch(() => {
message.error('删除失败');
});
DONE!虽然不是很完美,但还是解决了问题。