Как создать повторно используемое поле «Выбор» с использованием формы MUI и реагирования? ⇐ Javascript

[Anonymous]

Я создаю многоразовый входной компонент Select, используя пользовательский интерфейс материала (MUI) и реагирующую кунгунс. Я хочу, чтобы компонент: < /p>
полностью контролировался с использованием контроллера React-hook-форма. < /P>
Принять динамические параметры, передаваемые через реквизит. < /P>
Реализация: < /p>
import { JSX } from "@emotion/react/jsx-dev-runtime";
import {
Select,
FormLabel,
FormHelperText,
FormControl,
MenuItem,
} from "@mui/material";
import { Controller, useFormContext } from "react-hook-form";

export function RHFCustomSelect({
name,
options,
outerLabel,
styleMenu,
placeholder,
fullWidth = true,
...others
}: any): JSX.Element {
const { control } = useFormContext();

const menuProps: any = {
PaperProps: {
sx: {
marginTop: "10px",
},
},
};

return (
(

{outerLabel && (
{outerLabel}
)}


{placeholder ?? "Select"}

{options?.map(({ id, label, value }: any) => (

{label}

))}

{Boolean(error) && {error?.message}}

)}
/>
);
}


Подробнее здесь: https://stackoverflow.com/questions/795 ... -hook-form