Redux Devtool(Chrome扩展程序)未显示状态

Top*_*psy 4 javascript reactjs redux redux-devtools-extension

我是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'));
Run Code Online (Sandbox Code Playgroud)

这是动作:

export const USER_SELECTED = 'USER_SELECTED'
export function selectUser(user){
    return {
        type : USER_SELECTED,
        payload : user
    }
Run Code Online (Sandbox Code Playgroud)

}

这是一个减速器:

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

    return state
Run Code Online (Sandbox Code Playgroud)

}

最后呼吁采取行动:

this.props.selectUser(user)
Run Code Online (Sandbox Code Playgroud)

该应用程序运行良好,但我可能丢失了一些东西。

谢谢你的帮助 !

Cha*_*e L 10

您是否将此行添加到您的商店?

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
Run Code Online (Sandbox Code Playgroud)

github.com/zalmoxisus/redux-devtools-extension#11-basic-stor??e


Gib*_*boK 5

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

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

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