javascript - Redux Devtool(chrome 扩展)不显示状态

Question

我是 Redux 的新手，也是 Redux devtool 的新手。

我制作了一个简单的应用程序，您可以在其中点击一个用户，它会显示关于他的一些数据。

所以基本上处于我当前选择的用户的状态。

但我不知道为什么在 redux devtool 中状态一直为空。 (不在应用程序中)

这是我创建商店的地方:

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';

import App from './components/app';
import reducers from './reducers';

const createStoreWithMiddleware = applyMiddleware()(createStore);

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    <App />
  </Provider>
  , document.querySelector('.container'));

这是 Action :

export const USER_SELECTED = 'USER_SELECTED'
export function selectUser(user){
    return {
        type : USER_SELECTED,
        payload : user
    }

这是一个 reducer :

import {USER_SELECTED} from '../actions/index'
export default function (state = null,action){
    switch(action.type){
        case USER_SELECTED :
            return action.payload
    }

    return state

最后是号召性用语:

this.props.selectUser(user)

该应用运行良好，但我可能遗漏了一些东西。

感谢您的帮助!

Answer 1

如果您使用中间件设置商店，请尝试以下操作

import { createStore, applyMiddleware, compose } from 'redux';

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(reducer, /* preloadedState, */ composeEnhancers(
    applyMiddleware(...middleware)
  ));