ant-design / ant-design/pro-components

🧐[问题] ProTable如何使用dataSource而非request来更新数据?

Open
#7,230 4 comments 0 reactions 0 assignees View on GitHub
👏🏻 Welcome pr 📕 docs AI Reply
Dominant language
TypeScript
Stars
4.8k
Forks
1.4k
Avg merge
10h 44m
Merged PRs (30d)
3

Description

### 🧐 问题描述

在protable的文档中虽然解释了 `dataSource: Table 的数据,protable 推荐使用 request 来加载`,个人理解是当前两者都可以用于设置表内数据。然而个人测试下来发现似乎只设置dataSource的话,table初始还是空白的,如下:

```
import React, { useState } from 'react';
import { EditableProTable } from '@ant-design/pro-table';

interface Item {
key: string;
name: string;
age: number;
address: string;
}

const originData: Item[] = [];
for (let i = 0; i < 10; i++) {
originData.push({
key: i.toString(),
name: `Edward ${i}`,
age: 32,
address: `London Park no. ${i}`,
});
}

const App: React.FC = () => {
const [data, setData] = useState(originData);

const columns = [
{
title: 'name',
dataIndex: 'name',
width: '25%',
},
{
title: 'age',
dataIndex: 'age',
width: '15%',
},
{
title: 'address',
dataIndex: 'address',
width: '40%',
},
];

return (

);
};

export default App;
```

Contributor guide

Open the contributing guide

Research direction

Start by running the provided EditableProTable example with dataSource and compare it with the documented dataSource behavior. Then inspect the EditableProTable entry point and its data-loading path; the issue is resolved when dataSource-only usage either renders the supplied rows or the documentation clearly explains the limitation.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.