Reactjs 如何访问React组件中的存储？

我在这里处理react redux示例：

正在

setup.js

中创建redux存储，如下所示：

关键部分：

const initStore = ({onRehydrationComplete}) => {
  store = createStore(
    combineReducers({
      ...reactDeviseReducers,
      cats: [],
      form: formReducer,
      router: routerReducer,
      apollo: apolloClient.reducer()
    }),
    {},
    compose(
      applyMiddleware(
        thunk,
        routerMiddleware(history),
        apolloClient.middleware()
      ),
      autoRehydrate()
    )
  );

  persistStore(store, {
    blacklist: [
      'form'
    ]
  }, onRehydrationComplete);

  return store;
};

在react组件中的此文件之外：

CatsPage.js

我正在尝试.dispatch（loadCats（）），因此react应用程序将从服务器获取猫的列表，更新存储，并神奇地更新dom。以下是我在CatsPage.js中的内容：

import React from 'react';
import PropTypes from 'prop-types';
import {connect} from 'react-redux';
import CatList from './CatList';
import {loadCats} from '../../actions/catActions';
import {initStore} from '../../app/setup';

class CatsPage extends React.Component {
  state = {
    rehydrated: false
  };
  componentDidMount() {
    initStore.dispatch(loadCats())
  }
  render() {
    return (
      <div>
        <h1>Cats</h1>
        <div>
          <CatList cats={this.props.cats} />
        </div>
      </div>
    );
  }
}

CatsPage.propTypes = {
  cats: PropTypes.array.isRequired
};

function mapStateToProps(state, ownProps) {
  return {
    cats: state.cats
  };
}

export default connect(mapStateToProps)(CatsPage);

---

我假设您已正确设置了提供商。若这样，访问分派方法的正确方法是props。所以你可以这样做

this.props.dispatch(loadCats())

---

美好的这是有效的，因为它调用了服务器并得到了结果。。。结果似乎没有反映在DOM中。。。DOM没有更新。调试的最佳方式是什么？为什么？感谢您的

cats

prop是硬编码的。您是否在

mapStateToProps

中更改了这一行

cats:[{id:1，name:“Maru”}]

并取消了这一行上方的注释？如果我将其更改为

cats:state.cats

我会得到错误CatList.js:8未捕获类型错误：无法读取未定义的属性“map”更新后的MapStateTops是否正确？现在是

cats:state.cats

我稍后在CatList.js中使用.map，我刚刚用文件更新了这个问题。。。思想？谢谢

this.props.dispatch(loadCats())