Búsqueda de sitios web

javascript - ¿Recibes un error de Typescript que dice que algún tipo no se puede asignar al parámetro de tipo 'ReducerWithoutAction'?

Estoy construyendo un formulario para practicar y estoy usando useReducer() para manejar el estado. El error de Typescript que estoy recibiendo está relacionado con eso, he intentado resolverlo pero no tuve suerte.

El código completo está disponible aquí (Ruta: src/components/Input.tsx): CodeSandbox

Error completo:

Error de TypeScript en /form/src/components/Input.tsx(47,47): Ninguna sobrecarga coincide con esta llamada. Sobrecarga 1 de 5, '(reducer: ReducerWithoutAction, initializerArg: any, initializer?: undefined): [any, DispatchWithoutAction]', dio el siguiente error. El argumento del tipo '(state: InputState, action: InputAction) => { value: string | undefined; isValid: boolean | undefined; touched: boolean; }' no es asignable al parámetro del tipo 'ReducerWithoutAction'. TS2769

45 | const Input: React.FC<Props> = (props) => {
46 |     console.log(props.required);
47 |     const [inputState, dispatch] = useReducer(inputReducer, {
   |                                              
48 |         value: props.initialValue,
49 |         isValid: false,
50 |         touched: false

Respuesta #1

Es porque InputAction tiene las propiedades value y isValid como opcionales (tienen ?). Eso hace que InputAction sea equivalente a:

interface InputAction {
    value: string | undefined;
    isValid: boolean | undefined;
    touched: boolean;
}

que no se relacionará con las propiedades respectivas de InputState:

interface InputState {
    value: string,
    isValid: boolean,
    touched: boolean
}

Puede resolver este error estableciendo las propiedades respectivas de ActionInput como obligatorias (eliminando ?) o estableciendo las de InputState como opcionales.

Artículos relacionados