feat: improve demo

This commit is contained in:
chenos 2022-01-21 09:38:34 +08:00
parent 48722c7c99
commit 84f3ed1564

View File

@ -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',