댓글 등록 기능 작업

client 코드

reple state를 만들어 현재 유저 uid값과 입력값(reple), postId값을 server에 보내줍니다.

 

  const RepleUpload = (props) => {

    const [reple, setReple] = useState("");

 

    const user = useSelector((state) => state.user);

 

    const submitHandler = (e) => {

      e.preventDefault();

 

      if (reple === "") {

        return alert("댓글 내용을 채워주세요.");

      }

      let body = {

        reple: reple,

        uid: user.uid,

        postId: props.postId,

      };

 

      axios.post("/api/reple/submit", body).then((res) => {

        if (res.data.success) {

          alert("댓글 작성이 성공하였습니다.");

          window.location.reload();

        } else {

          alert("댓글 작성에 실패하였습니다.");

        }

      });

    };

 

    return (

      <RepleUploadDiv>

        <form>

          <input

            type="text"

            value={reple}

            onChange={(e) => {

              setReple(e.currentTarget.value);

            }}

          />

          <button onClick={submitHandler}>등록</button>

        </form>

      </RepleUploadDiv>

    );

  };

 

 

 

 

server 코드

reple(댓글) 스키마 작업

 

  const mongoose = require("mongoose");

 

  const repleSchema = new mongoose.Schema(

    {

      reple: String,

      author: {

        type: mongoose.Schema.Types.ObjectId,

        ref: "User",

      },

      //reple이 어떤 post에 속해있는지 알기 위해서 postId추가

      postId: {

        // reple에서 post정보 가져올 필요 없어서 ref 설정 안함

        type: mongoose.Schema.Types.ObjectId,

      },

    },

    { collection: "reples" }

  );

 

  const Reple = mongoose.model("Reple", repleSchema);

 

  module.exports = { Reple };

 

 

 

 

Post스키마 수정

 

  const mongoose = require("mongoose");

 

  const postSchema = new mongoose.Schema(

    {

      title: String,

      content: String,

      postNum: Number,

      image: String,

      author: {

        type: mongoose.Schema.Types.ObjectId,

        ref: "User",

      },

      //댓글 갯수를 알기 위해서 repleNum 추가

      repleNum: {

        type: Number,

        default: 0,

      },

    },

    { collection: "posts" }

  );

  const Post = mongoose.model("Post", postSchema);

 

  module.exports = { Post };

 

 

 

 

reple.js 서버 작업

 

  router.post("/submit", (req, res) => {

    let temp = {

      reple: req.body.reple,

      postId: req.body.postId,

    };

    //user에 있는 doc 찾아서 가져오기

    User.findOne({ uid: req.body.uid })

      .exec()

      .then((userInfo) => {

        temp.author = userInfo._id;

        const NewReple = new Reple(temp);

        NewReple.save(() => {

          Post.findOneAndUpdate(

            {

              _id: req.body.postId,

            },

             //_id를 1만큼 증가

            { $inc: { repleNum: 1 } }

          )

            .exec()

            .then(() => {

              return res.status(200).json({ success: true });

            });

        });

      })

      .catch((err) => {

        return res.status(400).json({ success: false });

      });

  });