mirror of
https://gitee.com/nocobase/nocobase.git
synced 2024-12-01 11:47:51 +08:00
feat: improve demo
This commit is contained in:
parent
48722c7c99
commit
84f3ed1564
@ -2,7 +2,14 @@ import { FormItem } from '@formily/antd';
|
|||||||
import { ArrayField } from '@formily/core';
|
import { ArrayField } from '@formily/core';
|
||||||
import { useField } from '@formily/react';
|
import { useField } from '@formily/react';
|
||||||
import { action } from '@formily/reactive';
|
import { action } from '@formily/reactive';
|
||||||
import { APIClient, APIClientProvider, Cascader, SchemaComponent, SchemaComponentProvider } from '@nocobase/client';
|
import {
|
||||||
|
APIClient,
|
||||||
|
APIClientProvider,
|
||||||
|
Cascader,
|
||||||
|
SchemaComponent,
|
||||||
|
SchemaComponentProvider,
|
||||||
|
useAPIClient
|
||||||
|
} from '@nocobase/client';
|
||||||
import MockAdapter from 'axios-mock-adapter';
|
import MockAdapter from 'axios-mock-adapter';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
@ -35,29 +42,28 @@ const useAsyncDataSource = (api: APIClient) => (field) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const useLoadData = (api: APIClient) => {
|
const useLoadData = () => {
|
||||||
return () => {
|
// hook 写在这里
|
||||||
// hook 写在这里
|
const api = useAPIClient();
|
||||||
const field = useField<ArrayField>();
|
const field = useField<ArrayField>();
|
||||||
return (selectedOptions) => {
|
return (selectedOptions) => {
|
||||||
const targetOption = selectedOptions[selectedOptions.length - 1];
|
const targetOption = selectedOptions[selectedOptions.length - 1];
|
||||||
targetOption.loading = true;
|
targetOption.loading = true;
|
||||||
// load options lazily
|
// load options lazily
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
targetOption.loading = false;
|
targetOption.loading = false;
|
||||||
targetOption.children = [
|
targetOption.children = [
|
||||||
{
|
{
|
||||||
label: `${targetOption.label} Dynamic 1`,
|
label: `${targetOption.label} Dynamic 1`,
|
||||||
value: 'dynamic1',
|
value: 'dynamic1',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: `${targetOption.label} Dynamic 2`,
|
label: `${targetOption.label} Dynamic 2`,
|
||||||
value: 'dynamic2',
|
value: 'dynamic2',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
field.dataSource = [...field.dataSource];
|
field.dataSource = [...field.dataSource];
|
||||||
}, 500);
|
}, 500);
|
||||||
};
|
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -73,7 +79,7 @@ const schema = {
|
|||||||
changeOnSelectLast: false,
|
changeOnSelectLast: false,
|
||||||
labelInValue: true,
|
labelInValue: true,
|
||||||
maxLevel: 3,
|
maxLevel: 3,
|
||||||
useLoadData: '{{useLoadData(apiClient)}}',
|
useLoadData: '{{useLoadData}}',
|
||||||
// fieldNames: {
|
// fieldNames: {
|
||||||
// label: 'name',
|
// label: 'name',
|
||||||
// value: 'code',
|
// value: 'code',
|
||||||
|
Loading…
Reference in New Issue
Block a user