node.js - ReferenceError: _id 未定义

Question

尝试传入 _id 以允许我的评论发布到我的前端 React 应用程序。当我在邮递员中测试快递路线时，我没有得到评论。请参阅下面的屏幕截图。当我尝试发布评论时，我得到参考错误 _id id not defined。

更新： _id 是固定的，id: data._id但我在浏览器中测试时看不到我的评论：

这是后端 express/node GalleryController.js

const mongoose = require('mongoose');
const Posts = mongoose.model('posts');

exports.PostGalleryInput = async (req, res) => {
  console.log(req.body);
  await new Posts({
    body: req.body,
    _id: req.params.id
  }).save(async (err, data) => {
    if (err) {
      console.log('err:', err);
      res.status(500).json({
        message: 'Something went wrong, please try again later.'
      });
    } else {
      res.status(200).json({
        message: 'Post Created',
        data,
        id: _id
      });
    }
  });
};

这是数据模式：

const mongoose = require('mongoose');

const PostSchema = new mongoose.Schema(
  {
    id: String,
    title: String,
    body: String,
    name: String,
    url: String,
    comment: String
  },
  {
    collection: 'posts'
  }
);

module.exports = mongoose.model('posts', PostSchema);

这是前端 React 组件

import React, { useState, useEffect } from 'react';
import Container from 'react-bootstrap/Container';
import Card from 'react-bootstrap/Card';
import Button from 'react-bootstrap/Button';
import axios from 'axios';
import './css/sharewall.css';

const Cards = () => {
  const [posts, setPosts] = useState([]);
  const [comment, setComment] = useState('');

  const loadPosts = async () => {
    try {
      let res = await axios.get(`http://localhost:5000/getall`);
      setPosts(res.data.reverse());
    } catch (error) {
      console.log(error);
    }
  };

  function saveComment(e, _id) {
    e.preventDefault();
    axios({
      method: 'POST',
      url: 'http://localhost:5000/postinput',
      data: {
        _id: _id,
        comment: comment
      }
    })
      .then((res) => {
        loadPosts();
      })
      .catch((err) => {
        console.log(err);
      });
  }

  const loadComment = async () => {
    try {
      let res = await axios.post('http://localhost:5000/postinput');
      setComment(res.data.comment._id);
      console.log(res.data.comment._id);
    } catch (error) {
      console.log(error);
    }
  };

  useEffect(() => {
    loadPosts();
    loadComment();
  }, []);

  return (
    <div className="compoentclass">
      <Container className="mt-5 ml-auto mr-auto">
        <div className="text-center">
          {posts.map(
            (post) =>
              post.url && (
                <div key={post._id}>
                  <Card className="">
                    <Card.Img alt="" src={post.url} />
                    <Card.ImgOverlay className="overlay">
                      <Card.Title className="d-flex justify-content-center align-items-center">
                        <Card.Text className="cardStyle text-light">{post.body}</Card.Text>
                      </Card.Title>
                    </Card.ImgOverlay>
                  </Card>

                  <div>
                    <Card.Text>{post.comment}</Card.Text>
                  </div>

                  <textarea
                    className="comment text-center mt-3 mb-3"
                    onChange={(e) => setComment(e.target.value)}
                    name="comment"
                    type="text"
                  />

                  <div className="d-flex justify-content-start mt-n3 mb-4">
                    <Button
                      className="shareButton"
                      variant="secondary"
                      onClick={(e) => saveComment(e, post._id)}
                    >
                      Comment
                    </Button>
                  </div>
                </div>
              )
          )}
        </div>
      </Container>
    </div>
  );
};

export default Cards;

标签： node.jsreactjsexpress