时间戳

首页 > 解决方案 > 在 mapStateToProps 中未定义 Redux 状态找不到问题

reactjs - 在 mapStateToProps 中未定义 Redux 状态找不到问题

问题描述

我无法找出我的错误。我在stackoverflow中尝试了很多答案，但这些对我不起作用。

这是我的减速器：IcmWebReducer.js 

    const initialState = {
    invoices : [],
    params: {
        status: 'Pending',
        _sort: 'documentInfo.dueDate',
        _order: 'desc',
        q: ''
     }
    };

    const IcmWebReducer = (state = initialState, action) =>{
    switch (action.type){
        case 'UPDATE_INVOICES':
            return Object.assign({}, state, {
                invoices: action.invoices
            });
        case 'UPDATE_PARAMS':
            return Object.assign({}, state, {
                params: action.params
            });
        default:
            return state;
    }
   };

export default IcmWebReducer;

这是我的App.js 

import React, {Component} from 'react';
import './App.scss';

import Header from './components/header/Header'
import InvoiceAudit from "./components/invoice/InvoiceAudit";

class App extends Component {
  render() {
    return (
        <div className="App container">
            <Header/>
         /*   <InvoiceAudit store = {this.props.store}/> */
            <InvoiceAudit/>
        </div>
    );
 } 
}

export default App;

这是index.js

import { Provider } from 'react-redux';
import { createStore } from 'redux';
import IcmWebReducer from "./reducers/IcmWebReducer";

let store = createStore(IcmWebReducer);

ReactDOM.render(
 <Provider store={store}>
 <App/>
 </Provider>, document.getElementById('root'));

这是我使用 mapStateToProps 方法的类

    const mapStateToProps = (state) => {
    console.log(state);
    return {
        invoices: state.IcmWebReducer,
    }
};

这显示我在 console.log 中未定义。但我找不到错误。我也在我的减速器中返回默认状态。谁能帮我

标签： reactjs

解决方案

在导出您的应用程序时，您应该使用connect;

export default connect(mapStateToProps)(App)

这可能有助于解决您的问题；

const ConnectedApp = connect(mapStateToProps)(App);

在index.js;

ReactDOM.render(< Provider store={store}>< ConnectedApp /></Provider>, document.getElementById('root'));

同样在您的 mapStateToProps 中，这就足够了

const mapStateToProps = (state) => {
console.log(state);
return {
    invoices: state.invoices,
    //status: state.params.status -> like this
}

我相信问题可能是您的发票状态正试图采用整个减速器初始状态，而不仅仅是发票空数组。

推荐阅读