Question

我看到了很多这样的帖子，但是我的问题仍然存在。我探讨了很多方法来操作redux上的对象的数组。 console.log输出未定义，并且在浏览器中我看到“无法读取未定义的属性'0'” 它是电子商务

CartReducer

import {
  GET_USUARIO_CARRITO,
  POST_USUARIO_CARRITO,
  GET_VISITANTE_CARRITO,
  POST_VISITANTE_CARRITO,
  EDITAR_VISITANTE_CARRITO,
  DELETE_CARRITO,
  PUT_CATEGORIA,
} from "../actions/ActionTypes";

const initialState = {
  CarritoCompleto: {},
  Res: {},
};

export default function carritoReducer(state = initialState, action) {
  switch (action.type) {
    case GET_USUARIO_CARRITO:
      const carrito = action.payload;
      const lineaDeOrdens = action.payload.lineaDeOrdens;
      return {
        ...state,
        CarritoCompleto: {
          ...carrito,
          lineaDeOrdens: Object.assign({}, lineaDeOrdens)
        },
      };

    case POST_USUARIO_CARRITO:
      return {
        ...state,
        Res: action.payload,
      };
    case GET_VISITANTE_CARRITO:
    //falta construir

    case DELETE_CARRITO:
      return;
    default:
      return state;
  }
}

CartAction

import {
    GET_USUARIO_CARRITO,
    POST_USUARIO_CARRITO,
    GET_VISITANTE_CARRITO,
    POST_VISITANTE_CARRITO,
    EDITAR_VISITANTE_CARRITO,
    DELETE_CARRITO,
    PUT_CATEGORIA,
} from "./ActionTypes";
import axios from "axios";

//NO TOCAR - MODIFICANDO EN BASE A RUTAS


//Esta esta totalmente incompleta, 
export const getUsuarioCarrito = (usuarioId) => (dispatch) => {
  axios.get(`http://localhost:3001/usuario/${usuarioId}/cart`) //falta url
    .then((res) => {
        dispatch({
            type: GET_USUARIO_CARRITO,
            payload: res.data,
            
    });
    })
    .catch((err) => {
      dispatch(postUsuarioCarrito);
    });
};

//post a usuario
//revisar que este bien igual que las demas.
export const postUsuarioCarrito = (usuarioId) => (dispatch) => {
 axios
    .post(`http://localhost:3001/usuario/${usuarioId}/cart`)
    .then((res) => {
      dispatch({
        type: POST_USUARIO_CARRITO,
        payload: res.data,
      });

      dispatch(postUsuarioCarrito());
    })

    .catch((err) => {
      const error = err.res.data;
      dispatch(error);
    });
};

//delete carrito
export const deleteCarrito = () => (dispatch) => {
  dispatch({
    type: DELETE_CARRITO,
    payload: null,
  });
};
export default { getUsuarioCarrito, postUsuarioCarrito, deleteCarrito};

组件车

import React, { useEffect, useState } from "react";
import "./carrito.css";
import Miniprod from "./miniproduct"
import Loader from "../Loader/Loader"
import { useSelector, useDispatch, connect } from 'react-redux'
import allActions from '../../redux/actions/allActions'

export default function Carrito() {


    // ================== ESTADO REDUX ======================//
    const usuario = useSelector(state => state.usuario.id)
    const productoCarrito = useSelector(state => state.carrito.CarritoCompleto.lineaDeOrdens)
    const dispatch = useDispatch()

    // ================== ESTADO COMOPONENTES ===================== //
    const [total, setTotal] = useState(0);
    const [envio, setEnvio] = useState(0);
    const [subtotal, setSubTotal] = useState(0);
    const [listaproductos, setListaProductos] = useState({});
    const [user, setUser] = useState(0)
    const descuento = 0.8;

    console.log(Object.values(productoCarrito)) =============> I probe the error like this

    // ================== USE EFFECT ========================//
    useEffect(
         () => {
           dispatch(allActions.getUsuarioCarrito(usuario))
           dispatch(allActions.login)
        },[])
  return (
        <div>
            ...
        </div>
    )
}

错误在哪里？或者，如何对对象数组进行迭代访问，以进行后期渲染非常感谢您提供解决方案！

状态为Redux的对象数组：无法读取未定义的属性“ 0”

0 个答案: