初学redux,请问这个问题如何处理?


import React from 'react'
import ReactDOM from "react-dom";

import { createStore, applyMiddleware, compose, combineReducers } from 'redux'
import { Provider } from 'react-redux'

import App from './modules/App'

const initialState = {
    cart: [
        {
            product: 'bread 700g',
            quantity: 2,
            unitCost: 90
        },
        {
            product: 'milk 500ml',
            quantity: 1,
            unitCost: 47
        }
    ]
}

const cartReducer = function(state=initialState, action) {
    return state;
}

const productsReducer = function(state=[], action) {
    return state;
}

const ADD_TO_CART = 'ADD_TO_CART';

const cartReducer = function(state=initialState, action) {
    switch (action.type) {
        case ADD_TO_CART: {
            return {
                ...state,
                cart: [...state.cart, action.payload]
            }
        }

        default:
            return state;
    }
}

function addToCart(product, quantity, unitCost) {
    return {
        type: ADD_TO_CART,
        payload: {
            product,
            quantity,
            unitCost
        }
    }
}

const allReducers = {
    products: productsReducer,
    shoppingCart: cartReducer
}

const rootReducer = combineReducers(allReducers);

let store = createStore(rootReducer);

console.log("initial state: ", store.getState());

const element = document.getElementById('taskRouter');

store.dispatch(addToCart('Coffee 500gm', 1, 250));

ReactDOM.render(
    <div>
        <App />
    </div>,
    element
);

图片描述

阅读 1.8k
3 个回答

这个明显的error tip.重复定义cartReducer 方法了。

常量 cartReducer 声明了两次啊 你把之前那个声明删掉就好了

// 这个删掉
const cartReducer = function(state=initialState, action) {
    return state;
}

const声明常量不可重复声明 常量cartReducer声明了两次

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题