Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

151
Vistas
Error: un productor de inmersión devolvió un nuevo valor *y* modificó su borrador. Devuelva un nuevo valor *o* modifique el borrador

tengo mi reductor

 const userAuthSlice = createSlice({ name: "userAuth", initialState: { token: '', }, reducers: { setToken: (state, action) => state.token = action.payload.test, }, });

Y tengo mi comando de despacho

 <button value={text.sign_in.submit} onClick={() => dispatch(userAuthSlice.actions.setToken({test:"test"}))} />

Cuando presiono el botón, lo que obtengo es este error:

ingrese la descripción de la imagen aquí

He aislado todo para estar seguro de que ese es el problema y nada más.

¿Por qué aparece este error?

over 4 years ago · Santiago Trujillo
7 Respuestas
Responde la pregunta

0

El problema es el uso de una función de flecha sin llaves como reductor, porque actúa como una declaración de retorno implícita. Entonces, ambos están mutando state.token y devolviendo el resultado de la asignación.

Según los documentos de Immer sobre la devolución de datos , hay un par de formas de solucionar esto:

  • Agregar el operador void delante de la asignación
  • Envolviendo la tarea entre llaves para convertirla en un cuerpo de función

por lo que setToken reducer se puede actualizar con void como

 setToken: (state, action) => void(state.token = action.payload.test)
over 4 years ago · Santiago Trujillo Denunciar

0

En lugar de

 state.token = action.payload.token

utilizar

 const token = action.payload.token state.token = token

Las constantes son inmutables, y asignar contenido de action.payload a una constante resolvió un problema para mí (Tenga en cuenta que en caso de que la carga útil sea un objeto, no es necesario

Ejemplo de trabajo de createSlice:

 import { createSlice } from '@reduxjs/toolkit'; export const slice = createSlice({ name: 'login', initialState: { username: "Foo", password: "AAA", authorized : false }, reducers: { setUsername: (state, action) => { const value = action.payload state.username = value // action.payload.username }, setPassword: (state, action) => { const value = action.payload state.password = value // action.payload.password }, logon: (state, action) => { state.username = action.payload.username state.password = action.payload.password state.authorized = true }, logoff: state => state.authorized = false }, });
over 4 years ago · Santiago Trujillo Denunciar

0

puedes olvidar el descanso; declaración en su archivo reducer.js;

 case LOGIN_USER_ERROR_RESET: draft.errormsg = ''; draft.loading = false; draft.error = false; break;
over 4 years ago · Santiago Trujillo Denunciar

0

Puntos para aprender sobre IMMER

  1. Si devuelve algo que no sea borrador de la función de receta, ese valor de retorno reemplazará el estado
  2. En su mayoría, desea mutar el borrador para mutar el estado, ** por lo que devolver el borrador después de modificarlo es opcional **, el immer devolverá el borrador finalizado de todos modos
  3. si devuelve algo más de la función de recipe , según el punto 1, el nuevo valor de retorno reemplazará el estado
  4. El punto 3 está bien, solo si no modifica el borrador en su función de receta . es decir, puedes elegir uno de los dos
    un. modificar el borrador -> devolver borrador o indefinido, cualquiera está bien
    B. quiere devolver algún valor nuevo, entonces no toque el borrador en absoluto

Ahora viene a responder a la pregunta. esta es tu función reductora

 (state, action) => state.token = action.payload.test

Esta función está haciendo dos cosas,
1. modificando el estado
2. devolver action.payload.test

entonces está violando el punto 4 y, por lo tanto, el error de la biblioteca Immer

en este caso específico, la intención es solo modificar el estado, por lo que tenemos que deshacer la devolución existente con void

 setToken: (state, action) => void(state.token = action.payload.test)

Sin embargo, la biblioteca de Immer recomienda el uso de un bloque de código para asegurar la coherencia en una gran base de código, este bloque de código implícitamente devuelve indefinido

 setToken: (state, action) => { state.token = action.payload.test }
over 4 years ago · Santiago Trujillo Denunciar

0

Intente verificar este enlace para Copiar sin referencia

over 4 years ago · Santiago Trujillo Denunciar

0

Respuesta correcta

Usar en lugar de

 const userAuthSlice = createSlice({ name: "userAuth", initialState: { token: '', }, reducers: { setToken: (state, action) => state.token = action.payload.test, }, });

Usa esto {Acabo de agregar corchetes}

 const userAuthSlice = createSlice({ name: "userAuth", initialState: { token: '', }, reducers: { setToken: (state, action) => { state.token = action.payload.test}, // <<= Change Here }, });
over 4 years ago · Santiago Trujillo Denunciar

0

Para aquellos que trabajan con React PullState , mi problema fue con la sintaxis:

Tuve:

 const onUpdate = (value: any) => { someStore.update((s) => (s.value = value)); };

pero tiene que ser:

 const onUpdate = (value: any) => { someStore.update((s) => { s.value = value; }); };

Por alguna razón, no le gusta la función de flecha declarada en el primer enfoque.

over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda