我刚刚开始在MERN Stack中开始尝试将位于RegisterModal.js的表单中的数据发布到server.js
index.html文件从index.js获取其内容,该内容呈现App.js并根据单击的按钮呈现不同的组件。 (这是我的理解)
其中一个是RegisterModal.js,我试图将这个表单中的数据发布到server.js
这两个文件的代码位于下面,我的项目结构如下。 (其余代码位于github http://github.com/yenvanio/testapp)
我得到的错误是“无法发布到/注册”,并且控制台给我一个未找到的错误。
- .idea
- build
- node_modules
- public
- index.html
- server.js
- src
- components
- AdminLoginModal.js
- PopUp.js
- RegisterModal.js
- UserLoginModal.js
- App.js
- index.js
- package.json
server.js
var express = require('express');
var cors = require('cors');
var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var app = express();
var schema = new Schema({
user: [
{
username: String,
password: String,
email: String,
}
]
}, {
collection: 'users'
});
var Model = mongoose.model('Model', schema);
mongoose.connect('mongodb://localhost:27017/dbName');
app.use(bodyParser.urlencoded({
extended:true
}));
app.use(bodyParser.json());
app.post("/register", function(request, response){
var username = request.body.username;
var password = request.body.password;
var email = request.body.email;
console.log("Post Received: %s %s %s", username, password, email);
});
var port = process.env.API_PORT || 3000;
// app.use('/api', router);
app.listen(port, function(){
console.log("Running on port 3000")
})
RegisterModal.js
import React, { Component } from 'react';
class RegisterModal extends Component
{
render() {
return(
<div>
<form method="post" action="/register">
Email Address:<br/>
<input type="text" name="email"/><br/>
Username:<br/>
<input type="text" name="username"/><br/>
Password:<br/>
<input type="password" name="password"/><br/>
<input type="submit" value="Register"/>
</form>
</div>
);
}
}
export default RegisterModal;
答案 0 :(得分:0)
您的代码看起来很好。
实际上,我复制粘贴它,我可以毫无问题地运行它。
你确定: