Estoy creando un formulario generado dinámicamente que lee un archivo de una plantilla. Tengo una serie de "preguntas" que están asignadas a un formulario de gancho de reacción. Los valores predeterminados que estoy usando son una matriz de objetos. El problema que tengo es usar reaccionar-seleccionar dentro de un controlador de formulario de gancho de reacción porque no establece el estado del formulario si es una matriz. En mis pruebas, funciona sin problemas si los valores predeterminados no son una matriz. Por favor vea mi ejemplo de código MRE

 const questions = [ { value: '', }]; const options = [ { value: 'chocolate', label: 'Chocolate' }, { value: 'strawberry', label: 'Strawberry' }, { value: 'vanilla', label: 'Vanilla' }, ]; export default function Form() { const methods = useForm({ defaultValues: questions, }); const onSubmit = (data: any) => console.log(data); return ( <form onSubmit={methods.handleSubmit(onSubmit)}> <Controller name="0.value" control={methods.control} render={({ field }) => ( <Select {...field} value={options.find((c) => c.value === field.value)} options={options} onChange={(e) => field.onChange(e?.value)} /> )} /> <button type="submit">Submit</button> </form> ); }

¿Cuál sería la mejor manera de obtener componentes de controladores de forma de gancho de reacción como reaccionar-seleccionar para trabajar con una matriz de valores predeterminados?