2025-09-12 17:46:36 +08:00

84 lines
2.5 KiB
TypeScript

import React from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Card, Alert, Typography, Input } from 'antd';
import { useIntl, FormattedMessage } from 'umi';
import styles from './Welcome.less';
import { useControlledValue } from 'ahooks';
export interface MyTestProps {
firstName?: string;
lastName: string;
}
export interface MyinputProps {
value: string;
onChange: (value: string) => void;
}
export function MyInput(props: MyinputProps) {
const [thisValue, setThisValue] = useControlledValue<string>(props);
// const { value, onChange } = props;
return <Input value={thisValue} onChange={() => setThisValue('xyz')}></Input>;
}
export function MyTest(props: MyTestProps) {
return <div>{props.firstName}</div>;
}
const CodePreview: React.FC = ({ children }) => (
<pre className={styles.pre}>
<code>
<Typography.Text copyable>{children}</Typography.Text>
</code>
</pre>
);
export default (): React.ReactNode => {
const intl = useIntl();
return (
<PageContainer>
<Card>
<Alert
message={intl.formatMessage({
id: 'pages.welcome.alertMessage',
defaultMessage: 'Faster and stronger heavy-duty components have been released.',
})}
type="success"
showIcon
banner
style={{
margin: -12,
marginBottom: 24,
}}
/>
<Typography.Text strong>
<FormattedMessage id="pages.welcome.advancedComponent" defaultMessage="Advanced Form" />{' '}
<a
href="https://procomponents.ant.design/components/table"
rel="noopener noreferrer"
target="__blank"
>
<FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
</a>
</Typography.Text>
<CodePreview>yarn add @ant-design/pro-table</CodePreview>
<Typography.Text
strong
style={{
marginBottom: 12,
}}
>
<FormattedMessage id="pages.welcome.advancedLayout" defaultMessage="Advanced layout" />{' '}
<a
href="https://procomponents.ant.design/components/layout"
rel="noopener noreferrer"
target="__blank"
>
<FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
</a>
</Typography.Text>
<CodePreview>yarn add @ant-design/pro-layout</CodePreview>
</Card>
</PageContainer>
);
};