CounterContainer

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import PropType from 'prop-types';
import Counter from '../components/Counter';
import * as counterActions from '../store/modules/counter';
import * as postActions from '../store/modules/post';

class CounterContainer extends Component {
  handleIncrement = () => {
    const { CounterActions } = this.props;
    CounterActions.increment();
  }

  handleDecrement = () => {
    const { CounterActions } = this.props;
    CounterActions.decrement();
  }

  addDummy = () => {
    const { PostActions } = this.props;
    console.log(PostActions);
    PostActions.addDummy({
      content: 'dummy',
      userUID: 123,
    });
  }

  render() {
    const { handleIncrement, handleDecrement, addDummy } = this;
    const { number } = this.props;

    return (
      <Counter
        onIncrement={handleIncrement}
        onDecrement={handleDecrement}
        addDummy={addDummy}
        number={number}
      />
    );
  }
}


CounterContainer.propTypes = {
  number: PropType.number.isRequired,
  CounterActions: PropType.shape({
    increment: PropType.func,
    decrement: PropType.func,
  }).isRequired,
};


export default connect(
  state => ({
    number: state.counter.number,
  }),
  dispatch => ({
    CounterActions: bindActionCreators(counterActions, dispatch),
    PostActions: bindActionCreators(postActions, dispatch),
  }),
)(CounterContainer);

PostContainer

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
// import { ListItem } from 'react-native-elements';
import { Text } from 'react-native';
import PropType from 'prop-types';
import Post from '../components/Post';
import * as postActions from '../store/modules/post';

class PostContainer extends Component {
  refreshing = () => {}

  onRefresh = () => {}

  renderItem = ({ item }) => (<Text>{item.content}</Text>)

  render() {
    const { renderItem } = this;
    const { postList } = this.props;

    return (
      <Post
        postList={postList}
        renderItem={renderItem}
      />
    );
  }
}

export default connect(
  state => ({
    postList: state.post.postList,
  }),
  dispatch => ({
    CounterActions: bindActionCreators(postActions, dispatch),
  }),
)(PostContainer);

modules/post

import { createAction, handleActions } from 'redux-actions';

const initialState = {
  postList: [{
    content: 'test',
    userUID: 123,
  },
  {
    content: '123123',
    userUID: 123123,
  },
  ],
};

const ADD_DUMMY = 'ADD_DUMMY';

export const addDummy = createAction(ADD_DUMMY, ({ content, userUID }) => ({ content, userUID }));

const reducer = handleActions({
  [ADD_DUMMY]: (state, action) => ({
    ...state,
    postList: [action.data, ...state.postList],
  }),
}, initialState);

export default reducer;

单击按钮会将虚拟数据添加到 postList。 但是，当我单击按钮时，我收到

TypeError：无法读取未定义错误的属性“内容”。

我以为我做的和倒计时教程一样。 但是倒计时有效。 添加我制作的虚拟数据不起作用。 哪里出了问题？

直到我单击添加虚拟数据按钮 列表才有效。