0

Estoy tratando de actualizar una propiedad de un objeto en un array de objetos con map, pero cuando llega a ese punto, el componente o la página se actualiza.

Tendrá que ver con el primer map? en ese, la función me pushea el elemento dentro del state, el cual es un array de objetos, pero si existe, la idea es actualizar una propiedad.

  handlerTabs : (state, action) => {               
    action.payload.isOpen = true                
    state.map(e => e.active = false)
    if (!state.some(tab => tab.id === action.payload.id)) {
        action.payload.active = true
        return state = [...state, action.payload]
    }  
          
    state.map((e) => {
        e.active = false
        if(e.id === action.payload.id){
            e.active = true              
        }        
    })       

  }

Estoy iniciando con redux. Ayuda.

1
  • Si la página se actualiza es porque ese if siempre esta pasando y regresa el estado. Parece que en el array están todos los id's y tu código busca por el id que viene en el payload el cual probablemente proviene del mismo estado también, entonces siempre va a pasar la validación. Si no es así te sugiero elaborar mas la pregunta, agrega el objeto state y da mas contexto.
    – g.4
    Commented el 15 sept. 2022 a las 2:37

1 respuesta 1

0

Lo pude solucionar, tiene que ver con el concepto de inmutabilidad

handlerTabs : (state, action) => {       
  const { id } = action.payload                  
  if (!state.some(tab => tab.id === id)) {                               
    let newArray = state.map(e=>{          
      return {
        ...e,
        active : false,              
      }                     
    })
    action.payload.isOpen = true
    action.payload.active = true
    return state = [...newArray, action.payload]
  } else {
    
    //Si existe el tab...              
    return state.map((e) => {               
      if(e.id === id){            
        return {
          ...e,
          active : true              
        }              
      } 
      else  {                 
        return {
          ...e,
          active : false
        }                    
        
      }                
           
    }) 
  }

}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.