initial commit
This commit is contained in:
3
src/App.css
Normal file
3
src/App.css
Normal file
@@ -0,0 +1,3 @@
|
||||
.App {
|
||||
padding: 16px;
|
||||
}
|
||||
27
src/App.tsx
Normal file
27
src/App.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
import React from 'react';
|
||||
import Component, { renderFieldProps } from './lib';
|
||||
import './App.css';
|
||||
import { ConfigProvider, Form } from '{{ UIPackageName }}';
|
||||
|
||||
const valueType = Component.displayName.charAt(0).toLowerCase() + Component.displayName.slice(1)
|
||||
|
||||
const App: React.FC = () => {
|
||||
return (
|
||||
<div className="App">
|
||||
<ConfigProvider
|
||||
valueTypeMap={{
|
||||
[valueType]: renderFieldProps,
|
||||
}}
|
||||
>
|
||||
<Form initialValues={{ test_valuetype: 'aaa', test_comp: 'bbb' }}>
|
||||
<Form.Item label="ValueType" name="test_valuetype" valueType={valueType} />
|
||||
<Form.Item label="Children" name="test_comp">
|
||||
<Component />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</ConfigProvider>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default App;
|
||||
13
src/index.css
Normal file
13
src/index.css
Normal file
@@ -0,0 +1,13 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||
monospace;
|
||||
}
|
||||
13
src/index.tsx
Normal file
13
src/index.tsx
Normal file
@@ -0,0 +1,13 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App';
|
||||
import './index.css';
|
||||
|
||||
const root = ReactDOM.createRoot(
|
||||
document.getElementById('root') as HTMLElement
|
||||
);
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
);
|
||||
0
src/lib/index.css
Normal file
0
src/lib/index.css
Normal file
42
src/lib/index.tsx
Normal file
42
src/lib/index.tsx
Normal file
@@ -0,0 +1,42 @@
|
||||
import React, { useImperativeHandle } from 'react';
|
||||
import { RenderFieldPropsType } from '{{ UIPackageName }}';
|
||||
import './index.css';
|
||||
|
||||
/**
|
||||
* props定义
|
||||
*/
|
||||
type {{ ComponentName }}Props = {
|
||||
defaultValue?: {{ ValueType }};
|
||||
value?: {{ ValueType }};
|
||||
onChange?: (value?: {{ ValueType }}) => void;
|
||||
};
|
||||
|
||||
/**
|
||||
* ref对象定义
|
||||
*/
|
||||
type {{ ComponentName }}Ref = {
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* 组件定义
|
||||
*/
|
||||
const {{ ComponentName }} = React.forwardRef<{{ ComponentName }}Ref, {{ ComponentName }}Props>((props, ref) => {
|
||||
const { value, defaultValue } = props;
|
||||
|
||||
useImperativeHandle(ref, () => {
|
||||
return {
|
||||
/* 请填写ref方法 */
|
||||
};
|
||||
});
|
||||
|
||||
return <>{JSON.stringify(value || defaultValue || '')}</>;
|
||||
});
|
||||
{{ ComponentName }}.displayName = '{{ ComponentName }}';
|
||||
|
||||
export const renderFieldProps: RenderFieldPropsType = {
|
||||
render: (value) => <>{JSON.stringify(value || '')}</>,
|
||||
renderFormItem: (_, props) => <{{ ComponentName }} {...props.fieldProps} />,
|
||||
};
|
||||
|
||||
export default {{ ComponentName }};
|
||||
1
src/react-app-env.d.ts
vendored
Normal file
1
src/react-app-env.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/// <reference types="react-scripts" />
|
||||
Reference in New Issue
Block a user