fix: 修复 inputTable 在分页情况切换数据表单项不更新的问题 (#10157)

This commit is contained in:
liaoxuezhi 2024-05-06 16:43:18 +08:00 committed by GitHub
parent 9e202bb573
commit e7dd9dbd34
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 72 additions and 2 deletions

View File

@ -1020,8 +1020,6 @@ test('Renderer:input-table canAccessSuperData', async () => {
expect(inputs).toEqual(['a1', '']);
});
// 对应 github issue: https://github.com/baidu/amis/issues/9537
test('Renderer:input-table item confirm validate', async () => {
const onSubmit = jest.fn();
@ -1085,3 +1083,74 @@ test('Renderer:input-table item confirm validate', async () => {
expect(container.querySelector('.has-error--isRequired')).toBeInTheDocument();
});
// 问题:分页切换后,新行数据中不存在原始行中的某个数据,但是切换后,表单项还是展示的原来的值
// 比如下面的例子,新行 c 字段不存在但是切过去后c 显示 c1
test('Renderer:input-table pagination data issue', async () => {
const onSubmit = jest.fn();
const {container, findByRole, findByText} = render(
amisRender(
{
type: 'page',
body: {
type: 'form',
data: {
table: [
{
a: 'a1',
b: 'b1',
c: 'c1'
},
{
a: 'a2',
b: 'b2'
}
]
},
body: [
{
showIndex: true,
type: 'input-table',
needConfirm: false,
perPage: 1,
name: 'table',
columns: [
{
name: 'a',
label: 'A'
},
{
name: 'b',
label: 'B',
quickEdit: {
type: 'form',
body: [
{
type: 'input-text',
name: 'b'
},
{
type: 'input-text',
name: 'c'
}
]
}
}
]
}
]
}
},
{},
makeEnv({})
)
);
await wait(200);
const nextBtn = container.querySelector('.cxd-Pagination-next');
fireEvent.click(nextBtn!);
await wait(200);
const c = container.querySelector('input[name="c"]');
expect(c).toHaveValue('');
});

View File

@ -1876,6 +1876,7 @@ export default class FormTable extends React.Component<TableProps, TableState> {
draggable: draggable && !this.state.editIndex,
items: items,
getEntryId: this.getEntryId,
reUseRow: false, // 这个会导致 getEntryId 无效因为复用的话row 的 id 不会更新
onSave: this.handleTableSave,
onRadioChange: this.handleRadioChange,
onSaveOrder: this.handleSaveTableOrder,