Question

我正在尝试在redux中更改const的状态。我正在尝试在要更改状态的组件中直接尝试进行分派。分派后更改了状态，但是我又得到了一个对象。当我使用Console.log时，我得到[Object] [Object]，在调用dispatch之前，我曾使用过该状态的值。

这是我的商店。

import { createStore,applyMiddleware , compose } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

//const  initialState = {};

const middleware = [thunk];
const store = createStore(
    rootReducer,
    compose(
        applyMiddleware(...middleware),
        window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
    )

);


export default store;

这是我的主要减速器。

import { combineReducers } from 'redux';
import sidebarReducer from './sidebarReducer';


export default combineReducers({
    name : sidebarReducer

});

这是我的CustomReducer，我称之为sidebarReducer。

import { TOGGLE_SIDEBAR } from '../actions/types';


let sidebarname = "wrapper slide-menu";


export default function(state=sidebarname,action){
    switch(action.type){
            case TOGGLE_SIDEBAR:
            console.log('reducer called');
            console.log(state);
                return{

                        ...state,
                        sidebarname :  action.payload

                };



    }
    return state;


}

这是我的Dispatch和MapStatetoProps函数。

const mapStatetoProps = state  => ({
  name : state.name

});
const mapDispatchtoProps = dispatch => ({

  setName : (name) => {

        dispatch({

            type: "TOGGLE_SIDEBAR",
            payload: name 

        })

  }

})
export default connect(mapStatetoProps,mapDispatchtoProps)(App);

我成功地从商店中获取了State，但是当我调度时，我取回了一个Object。

sidebarReducer.js:13 reducer called
sidebarReducer.js:14 wrapper slide-menu
App.js:38 sidebarname is [object Object]
App.js:40 wrapper slide-menu

Answer 1

在处理动作时，您要返回一个对象（检查花括号）：

return {
  ...state,
  sidebarname: action.payload
};

由于整个状态仅是字符串sidebarname，因此您应该仅返回有效载荷：

return action.payload

或者，您可以将状态作为对象，然后您的操作返回应该可以正常工作：

let initialState = { sidebarmenu: "wrapper slide-menu" };
...
export default function(state=initialState,action){
  ...
}

Answer 2

您的sidebarReducer仅管理一个字符串。只需在TOGGLE_SIDEBAR上返回action.payload，而不是具有sidebarname属性的对象即可。

Redux Reducer返回[Object Object]，但是我想要字符串吗？

2 个答案: