Aquí hay un componente de entrada personalizado
const Input = ({props}) => { return ( <input type="text" {...props} {...props.reg}/> ); };Pasé una función de registro de React Hook Form a esta entrada personalizada.
<Input props={{ placeholder: 'Name', id: 'form__name', name: 'name', reg: {...(register('name'), {required: true})} }}/>La entrada se registró y no pude descifrar qué significan los corchetes antes del operador de propagación.
¿Qué tipo de sintaxis JS/React es? ...(xxx,xxx)
PD: esta línea de código
reg: {...(register('name'), {required: true})}fue tomado de un video de youtube, solo lo reescribí, pero los corchetes antes del operador de propagación todavía se usaban en el video
El operador de coma rara vez se usa de esta manera, pero esencialmente, si hace esto
statment1, statement2 Luego se devuelve la segunda instrucción. Sin embargo, statment1 se ejecuta, simplemente no se devuelve.
Aquí se usa para registrar el campo, pero el resultado de la declaración dentro de los corchetes en realidad es solo {required: true} .
Los corchetes en sí solo encierran esta declaración de coma interna. Primero se evalúa el interior de los corchetes y luego se distribuye el resultado.
Más información aquí https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comma_Operator