Я работаю над приложением для отслеживания упражнений с использованием стека MERN. Я столкнулся с ошибкой и не могу ее обработать. create-user.componet.js файл: -
import React, { Component } from 'react';
const axios=require('axios');
class CreateUser extends Component {
constructor(props)
{
super(props);
this.onChangeUsername=this.onChangeUsername.bind(this);//even binding
this.onSubmit = this.onSubmit.bind(this);//event binding
this.state={
username: '',
}
}
onChangeUsername(e) {
this.setState({
username: e.target.value
})
}
onSubmit(e){
e.preventDefault() //prevents from default process and implements the lined following
const user={
username: this.state.username
};
console.log(user)
//connecting the front end to the backend. On submit the username will be stored in the backend.This is done by using axios
axios.post('http://localhost:3000/users/add',user)//accesses the route mentioned in user.js and hence connecting to the backend
.then(res=> {
console.log(res)
console.log(res.data)});
this.setState({
username: ''
})
}
render() {
return (
<div>
<h3>Create New User</h3>
<form onSubmit={this.onSubmit}>
<div className="form-group">
<label>Username: </label>
<input type="text"
required
className="form-control"
value={this.state.username}
onChange={this.onChangeUsername}/>
</div>
<div className="form-group">
<input type="submit" value="Create User" className="btn btn-primary">
</input>
</div>
</form>
</div>
)
}
}
export default CreateUser
route f ie: -
const router=require('express').Router();
let User=require('../models/user.model')
router.route('/').get((req,res) => {
User.find()
.then(users => res.json(users))
.catch(err => res.status(400).json('Error:'+err))
});
router.post('/add', function(req, res) {
const username = req.body.username;
const newUser = new User({username});
newUser.save()
.then(() => res.json('User added!'))
.catch(err => res.status(400).json('Error: ' + err));
});
module.exports=router;
ошибка:
POST http://localhost:3000/users/add 404 (Not Found)
При реализации в приложении отображается указанная выше ошибка, тогда как api работает нормально при тестировании в бессоннице (инструмент).
Может ли кто-нибудь помочь решить эту проблему?