test/amis
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-15 09:21:13 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: 解决tree异步数据不渲染的问题 (#5980)

Browse Source
This commit is contained in:
meerkat 2022-12-27 10:46:00 +08:00 committed by GitHub
parent 9d18904eef
commit d7409498d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/amis-ui/src/components/Tree.tsx
View File

@ -240,6 +240,7 @@ export class TreeSelector extends React.Component<
}; };
this.syncUnFolded(props); this.syncUnFolded(props);
this.flattenOptions(props, true);
} }
componentDidMount() { componentDidMount() {
@ -247,8 +248,6 @@ export class TreeSelector extends React.Component<
// onRef只有渲染器的情况才会使用 // onRef只有渲染器的情况才会使用
this.props.onRef?.(this); this.props.onRef?.(this);
// 初始化
this.flattenOptions();
enableNodePath && this.expandLazyLoadNodes(); enableNodePath && this.expandLazyLoadNodes();
} }
@ -257,6 +256,7 @@ export class TreeSelector extends React.Component<
if (prevProps.options !== props.options) { if (prevProps.options !== props.options) {
this.syncUnFolded(props); this.syncUnFolded(props);
this.flattenOptions(props);
} }
if ( if (
@ -326,7 +326,6 @@ export class TreeSelector extends React.Component<
} }
}); });
this.flattenOptions();
initFoldedLevel && this.forceUpdate(); initFoldedLevel && this.forceUpdate();
return unfolded; return unfolded;
@ -832,7 +831,10 @@ export class TreeSelector extends React.Component<
/** /**
* TODO: this.unfolded => reaction 更加合理 * TODO: this.unfolded => reaction 更加合理
*/ */
flattenOptions(props?: TreeSelectorProps): void | Option[] { flattenOptions(
props?: TreeSelectorProps,
initial?: boolean
): void | Option[] {
let flattenedOptions: Option[] = []; let flattenedOptions: Option[] = [];
eachTree( eachTree(
@ -855,7 +857,7 @@ export class TreeSelector extends React.Component<
} }
} }
); );
if (!this.state.flattenedOptions.length && flattenedOptions.length) { if (initial) {
// 初始化 // 初始化
this.state = {...this.state, flattenedOptions}; this.state = {...this.state, flattenedOptions};
} else { } else {

2
packages/amis/__tests__/renderers/Form/__snapshots__/chainedSelect.test.tsx.snap
View File

@ -317,7 +317,7 @@ exports[`Renderer:chained-select 1`] = `
</span> </span>
<div <div
class="cxd-PopOver cxd-Select-popover cxd-PopOver--leftBottomLeftTop" class="cxd-PopOver cxd-Select-popover cxd-PopOver--leftBottomLeftTop"
style="display: block; width: auto; left: 0px; top: 0px; position: relative;" style="display: block; width: 0px; left: 0px; top: 0px; position: relative;"
theme="cxd" theme="cxd"
> >
<div <div

9
packages/amis/__tests__/renderers/Form/chainedSelect.test.tsx
View File

@ -113,12 +113,11 @@ test('Renderer:chained-select', async () => {
expect(getByText('C 3')).toBeInTheDocument(); expect(getByText('C 3')).toBeInTheDocument();
fireEvent.click(getByText('C 3')); fireEvent.click(getByText('C 3'));
await wait(100); await waitFor(() => {
expect(fetcher).toBeCalledTimes(5); expect(fetcher).toBeCalledTimes(5);
});
fireEvent.click(getByText('请选择')); fireEvent.click(getByText('请选择'));
expect(getByText('未找到任何结果')).toBeInTheDocument(); expect(getByText('未找到任何结果')).toBeInTheDocument();
await waitFor(() => { expect(container).toMatchSnapshot();
expect(container).toMatchSnapshot();
});
}); });