Material automático controlado UI
<Controller
defaultValue={null}
name={"name"}
control={control}
rules={{
required: true, // for mandatory field
validate: (data) => { // checking whether array is empty or not
if(data.length === 0) return false
}}
}
render={({value, name, onChange}) => (
<Autocomplete
value={value}
multiple
name={name}
size="small"
id="status"
options={options}
disableCloseOnSelect
onChange={(e, v) => {onChange(v);} }
getOptionLabel={(option) => option.name}
renderOption={(props, option, { selected }) => (
<li {...props}>
<Checkbox
icon={icon}
checkedIcon={checkedIcon}
style={{ marginRight: 8 }}
checked={selected}
/>
{option.name}
</li>
)}
style={{ width: 250 }}
renderInput={(params) => (
<TextField {...params} /* error={errors.name ? true : false} */ variant="outlined" label="Select" />
)}
/>
)}
/>
Himanshu Makwana