Javascript React.js:props.state为空（null）

我想列出正在使用的待办事项React.js+Redux

我创建了一个文件：

import { ADD_POST, REMOVE_POST } from "../actions/index.jsx";

const initialState = {
 title: "",
 content: ""
};

export default function Post(state = initialState, action) {
 switch (action.type) {
  case ADD_POST:
   return [
    ...state,
    {
      id: action.id,
      title: action.title,
      content: action.content
    }
  ];
  case REMOVE_POST:
    return state.filter(({ id }) => id !== action.id);
  default:
    return state;
 }
}

我编辑App.js：

class App extends Component {
render() {
  return (
    <div className="App">
      <Input />
      <List posts={this.props.allPosts} />
  </div>
  );
 }
}

const mapStateToProps = state => {
 return {
   allPosts: [state.title, state.content]
 };
};

export default connect(mapStateToProps, null)(App);

---

我认为你混淆了你所在州的数据类型。下面的代码片段可能适合您。我将您的状态保留为帖子数组，initialState为空数组。
因此，在reducer文件中，将initialState初始化为：

导入{
添加(u POST),，
拆下接线柱
}来自“./actions/index.jsx”；
常量initialState=[]；
导出默认函数Post（状态=初始状态，操作）{
开关（动作类型）{
案例添加职位：
返回[
……国家，
{
id:action.id，
标题：action.title，
内容：action.content
}
];
案例移除后：
返回状态过滤器(({
身份证件
})=>id！==action.id）；
违约：
返回状态；
}
}

您是否已将

MapStateTrops

函数添加到组件文件中？@Blundering我在App.js中添加了MapStateTrops您可以显示您的操作吗？@Colin使用post添加操作。您可以显示列表组件吗？我更改了它，但出现错误“TypeError:this.props.posts.map不是函数”.你能用MapStateTops打印状态并告诉我你得到了什么吗。

 render() {
   return (
     <div>
       <ul>
         {this.props.posts.map((post, index) => (
         <Item {...post} key={index} />
        ))}
       </ul>
     </div>
   );
  }
 }

export const ADD_POST = "ADD_POST";
export const REMOVE_POST = "REMOVE_POST";

let nextId = 0;

export function addPost(title, content) {
 return {
   type: ADD_POST,
   id: nextId++,
   title,
   content
 };
}

export function removePost(id) {
 return {
   type: REMOVE_POST,
   id
 };
}