React-Native/Redux 错误：请求的键值不是对象答案

【问题标题】：React-Native/Redux Error: Requested keys of a value that is not an objectReact-Native/Redux 错误：请求的键值不是对象
【发布时间】：2017-02-28 15:11:30
【问题描述】：

在运行以下代码时，我最终在 CategoryList.js 中收到错误消息“请求的值不是对象的键”。

我认为 CategoryContainer.js 中的“stores.dispatch(CategoryAction.categoryView())”应该将值设置为 props 类别，但 CategoryList.js 中的 this.props.categories 返回导致错误的 null 值。

ConfigureStore.js：

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

const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
const store = createStoreWithMiddleware(reducers);
export default store;

CategoryContainer.js：

import React, { Component } from 'react';
import stores from '../stores/ConfigureStore';
import * as CategoryAction from '../actions/CategoryAction';

stores.dispatch(CategoryAction.categoryView());

class CategoryContainer extends Component {
  render() {
    return (
      <CategoryList/>
    );
  }
}

const mapStateToProps = (state) => {
  return {
    categories: state.categories,
  };
}

const mapDispatchToProps = (dispatch) => {
  return {
    bindActionCreators(CategoryAction, dispatch)
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(CategoryContainer);

CategoryAction.js：

import * as actionTypes from './ActionTypes';
import AppConstants from '../constants/AppConstants';

export function categoryView() {
  const categories = [{name:'CATEGORY', type:'CATGORY_TYPE'}];
  return {
      type: "CATEGORY_VIEW",
      categories: categories
  };
}

CategoryReducer.js：

const initialState = {
  categories:[]
}

export default function categoryReducer (state = initialState, action) {
  switch (action.type) {
    case "CATEGORY_VIEW":
      return Object.assign({}, state, {
              categories: action.categories
            });
    }
}

CategoryList.js：

import React, {Component} from 'react';
import {
  Text, View, TouchableHighlight, TouchableOpacity, ListView, StyleSheet
} from 'react-native';

import * as AppConstants from '../constants/AppConstants';
import CategoryAdd from '../components/CategoryAdd';

export default class CategoryList extends Component {

  constructor(props) {
    super(props);

    this.ds = new ListView.DataSource({rowHasChanged: (row1, row2) => row1 !== row2})
    this.state = {
      dataSource: this.ds.cloneWithRows(this.props.categories),
    }
  }
}

我什至在 CategoryContainer.js 中尝试如下，但没有帮助。还是一样的错误，

<CategoryList {...this.props}/>

但是，如果我通过将 this.props.categories 替换为如下常量值来更改 CategoryList.js，则它可以工作。

    const categories = [{name:'CATEGORY', type:'CATGORY_TYPE'}];
    this.state = {
      dataSource: this.ds.cloneWithRows(categories),
    }

请协助在 redux 流程上设置 this.props.categories 中的值。

【问题讨论】：

标签： react-native react-redux

【解决方案1】：

你应该像这样在 reducer 中更新 categories 数组 -

  return Object.assign({}, state, {
    categories: Object.assign([], state.categories, action.categories)
  });

然后在容器中执行<CategoryList {...this.props}/>。

【讨论】：

我尝试了建议的解决方案，但仍然遇到相同的错误。不知道我错在哪里。

【解决方案2】：

CategoryContainer.js 中的以下更改使其工作，

    categories: state.categoryReducer.categories,
    modal: state.categoryReducer.modal

【讨论】：