前言:在protable单元格中增加loading,还真没思路,看render()方法的四个参数,感觉都用不上。
后来在朋友的帮助下用如下方法解决。
import React, { useState } from 'react'; import { Space, Spin, Table } from 'antd'; // 发空投loading const [loading, setLoading] = useState(false) const [currId, setCurrId] = useState(0) const columns = [ { title: '状态', width: '100px', key: 'status', dataIndex: 'status', ellipsis: true, hideInSearch: true, // 在查询表单中不展示此项 render: (text, record, _, action)=> { const statusArr = ['', '未发放', '待确认', '发放成', '发放失败', '无效'] return (loading && record.id === currId) ? <Spin indicator={<LoadingOutlined style={{ fontSize: 24 }} spin />} /> : statusArr[record.status] }, { title: 'Age', dataIndex: 'age', key: 'age', }, // ... 其他列 ]; // 发空投 const onSendClick = async(item: any) => { setCurrId(item.id) setLoading(true) 异步 setLoading(false) }, const App = () => { return <Table columns={columns} dataSource={data} />; }; export default App;
标签:status,loading,const,pro,单元格,setLoading,useState,antd From: https://www.cnblogs.com/zccst/p/18140080