Reactjs 向db提交表单时，我的MERN应用程序中出现一些错误

基本上，我在控制台中得到了这3个错误

一,。 未捕获（承诺中）错误：操作必须是普通对象。相反，实际的类型是：“承诺”。您可能需要将中间件添加到存储设置中以处理分派其他值，例如“redux thunk”以处理分派函数。有关示例，请参见和

二,。 未捕获（承诺中）错误：请求失败，状态代码为409

三,。 RPOSThttp://localhost:5000/posts

App.js

 import React, { useEffect } from "react";

import { useSelector } from "react-redux";

// all components we are gonna use from material-ui
import { Container, AppBar, Typography, Grow, Grid } from "@material-ui/core";

// importing hook from react-redux
import { useDispatch } from "react-redux";
// allows us to dispatch an action

import { getPosts } from "./actions/posts";

import Posts from "./components/Posts/Posts.js";
import Form from "./components/Form/Form.js";

import memories from "./images/memories.png";

//importing styles file -> styles.js
import useStyles from "./styles.js";

const App = () => {
  const classes = useStyles();

  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(getPosts());
  }, [dispatch]);

  return (
    <Container maxWidth="lg">
      <AppBar className={classes.appBar} position="static" color="inherit">
        <Typography className={classes.heading} variant="h2" align="center">
          Memories
        </Typography>

        <img
          className={classes.image}
          src={memories}
          alt="mmemories"
          height="60"
        />
      </AppBar>
      <Grow in>
        <Container>
          <Grid
            container
            justify="space-between"
            alignItems="stretch"
            spaceing={3}
          >
            <Grid item xs={12} sm={7}>
              <Posts />
            </Grid>
            <Grid item xs={12} sm={4}>
              <Form />
            </Grid>
          </Grid>
        </Container>
      </Grow>
    </Container>
  );
};

export default App;

import React，{useffect}来自“React”；
从“react redux”导入{useSelector}；
//我们将从material ui使用的所有组件
从“@material ui/core”导入{Container、AppBar、排版、Grow、Grid}；
//从react redux导入钩子
从“react redux”导入{useDispatch}；
//允许我们发送一个动作
从“/actions/posts”导入{getPosts}”；
从“/components/Posts/Posts.js”导入帖子；
从“/components/Form/Form.js”导入表单；
从“/images/memories.png”导入内存；
//导入样式文件->style.js
从“/styles.js”导入useStyles；
常量应用=（）=>{
const classes=useStyles（）；
const dispatch=usedpatch（）；
useffect（（）=>{
调度（getPosts（））；
}，[发送]；
返回(
回忆
);
};
导出默认应用程序；

index.js

import React from "react";
import ReactDOM from "react-dom";

// initializing redux
import { Provider } from "react-redux";
// Provider is going to keep track of that store which is that global state
//  -- and that allows us to acess that store from any where inside the app

import { createStore, applyMiddleware, compose } from "redux";

import thunk from "redux-thunk";

import { reducers } from "./reducers";

import App from "./App";

//to set redux --> 1st set store
const store = createStore(reducers, compose(applyMiddleware(thunk)));

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById("root")
);

从“React”导入React；
从“react dom”导入react dom；
//初始化redux
从“react redux”导入{Provider}；
//提供商将跟踪该存储，即该全局状态
//--这使我们能够从应用程序中的任何位置访问该商店
从“redux”导入{createStore，applyMiddleware，compose}；
从“redux thunk”导入thunk；
从“/reducers”导入{reducers}”；
从“/App”导入应用程序；
//设置redux-->第一个集合存储
const store=createStore（reducer，compose（applyMiddleware，thunk））；
ReactDOM.render(
,
document.getElementById（“根”）
);

{我知道我绝对无法将所有代码粘贴到这里，如果没有完整的预览，您将无法提供帮助，但请尝试…}