Question

我无法将索引从状态映射到键值。 state.datalist的我的状态值是在加载componentA时设置的。我已经逐步完成了componentB的操作，并且看到state.datalist最初具有使用我的项目列表填充的值。但是，在componentB中完成渲染功能后，state.datalist.items的值将变得不确定。 state.datalist.selected仍然被定义。为什么是这样？我的减速器在我的状态下没有触摸datalist.items键。

我基本上是使用componentA中的调度程序来设置状态，该调度程序用于检索项目列表。然后，我在componentA中显示该列表。在componentA中单击链接时，它会进行分派，将选定的项目ID设置为状态，然后使用componentB重定向到history.push(/componentB)。

componentB最初加载时是以下项：

[
  0:{dataId:5, dataName: "Some text"},
  1:{dataId:6, dataName: "Some more text"}
]

在componentA中，我单击一个链接，选择带有dataId 5的项目。然后将其分配给状态中的selected值。

我的操作代码：

function setSelectedData(dataId) {
   return dispatch => {
       dispatch(request(dataId));
   };

   function request(dataId) { return { type: competitionConstants.SETSELECTED, dataId} }

}

我的减速器代码：

import { constants } from '../_constants';

const initialState = {items: [], loading: false, selected: null}

export function datalist(state = initialState, action) {
  switch (action.type) {
        case dataConstants.SETSELECTED:
    console.log("the action value in SETSELECTED: ", action)
    return {
        ...state,
        selected: action.dataId,
        loading: false
    };
    default:
      return state
  }
}

在componentA中，我具有以下用于onClick的处理程序。

handleLoadData(dataId) {
    this.props.dispatch(dataActions.setSelectedCompetition(dataId));
    history.push('/componentB')
}

在componentB中，我有一个mapStateToProp函数，该函数传递给我进行连接。

function mapStateToProps(state) {
   const { selected, loading, items } = state.datalist;

   return {
      //myKey: items, 
      myKey: items[selected], //this is what I'm trying to get to work
      isLoading: loading
   };
}

export default connect(mapStateToProps)(Dashboard);

React Redux如何在mapStateToProps中索引状态键

0 个答案: