Field Switch

show code

componennt

import {Button, Stack} from '@mui/material';
import PropsTable from '@site/src/components/PropsTable';
import {NotifyProvider} from 'mui-eazy';
import {
	useFormRef,
	FieldDatePicker,
	FormProvider,
	notify,
	LocalizationProvider,
} from 'mui-eazy';

export const FieldSwitchDemo = () => {
	const formRef = useFormRef({});
	const {handleSubmit} = formRef;
	const onSubmit = handleSubmit(() => {
		notify.success(JSON.stringify(formRef.getValues()));
	});
	return (
		<FormProvider formRef={formRef} onSubmit={onSubmit}>
			<FieldSwitch label={'field'} name="field"></FieldSwitch>
			<Stack
				direction="row"
				sx={{
					justifyContent: 'end',
				}}>
				<Button
					sx={{
						marginTop: '10px',
					}}
					variant="contained"
					type="submit">
					Submit
				</Button>
			</Stack>
		</FormProvider>
	);
};

Props

tip

• Type: any, can be customized as needed.
• Default value:
  • Not specified: optional.
  • Specified as "require": mandatory.
• Type link: Click to navigate to the details below.

Type

name	type	defaultValue	desc
name	string		form item name
label	number		form item label
defaultValue	any		The default value. Use when the component is not controlled.
value	any		The value of the input element, required for a controlled component.
type	string		Type of the input element. It should be a valid HTML5 input type.
required	boolean	false	If true, the label is displayed as required and the input element is required.