Saya sedang membina aplikasi CRUD mudah menggunakan tindanan MERN Di bawah ialah kod untuk menambah butiran pengguna dalam db
import React , {useState, useEffect} from 'react' import axios from 'axios'; import { useNavigate } from 'react-router-dom'; const initialValue = { name: '', username: '', email: '', phone: '' } const AddUser = () => { // hooks const [user, setUser] = useState(initialValue); const { name, username, email, phone } = user; let navigate = useNavigate(); const onValueChange = (e) => { setUser({...user, [e.target.name]: e.target.value}) } // ADD USER const config = { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } } const addUser = async (user) => { return await axios.post("http://localhost:5000/add", user , config); } const addUserDetails = async() => { await addUser(user); navigate('/all'); } return ( <div> <h1>Add Details</h1> <form className="form"> <input onChange={(e) => onValueChange(e)} placeholer="Add Name"name='name' value={name} id="my-input" /> <input onChange={(e) => onValueChange(e)} placeholer="Add Username"name='username' value={username} id="my-input" /> <input onChange={(e) => onValueChange(e)} placeholer="Add Email"name='email' value={email} id="my-input" /> <input onChange={(e) => onValueChange(e)} placeholer="Add Phone"name='phone' value={phone} id="my-input" /> <button type="submit" onClick={() => addUserDetails()}>Add</button> </form> </div> ) } export default AddUser
Berikut ialah tangkapan skrin mongodb
Berikut ialah Route.js
const router = require('express').Router(); const User = require('../model/todoItems.js'); // Coming from model // POST DATA router.post('/add',async (req,res) =>{ try { const newUser = new User({user: req.body.user}); // saving in db await newUser.save(); res.status(201).json(newUser); } catch (error) { res.status(409).json({ message: error.message}); } } ); module.exports = router;
Berikut ialah modelnya
const mongoose = require( 'mongoose'); const userSchema = new mongoose.Schema({ user:{ name: String, username: String, email: String, phone: Number } }); module.exports= mongoose.model('user', userSchema);
{_id:ObjectId(641548f49338e07c498bf231),__v:0} ini yang saya dapat Sambungan pangkalan data berjaya. Saya mahu semua butiran disiarkan, apakah yang perlu saya lakukan?
Terdapat beberapa ralat dalam kod anda. Saya fikir masalah itu akan diselesaikan apabila anda membetulkannya.
1-) Semak sama ada anda telah mengimport model yang betul dalam route.js. Kerana ia adalah todoItem.js. Saya fikir ini mesti berkaitan pengguna.
2-) Dalam model mongoose, tidak perlu menggunakan pengguna sebagai induk. Hanya padamkannya supaya kelihatan seperti:
3-) Dalam route.js, tukar baris const newUser seperti berikut:
4-) Pastikan anda menggunakan console.log untuk mendapatkan req.body yang betul