使用 React、Redux 和 Express 添加用户注册和身份验证

Question

我有一个使用 Express 和 Mongo 的 React/redux 应用程序。我希望用户能够注册一个帐户，但是我不确定如何让 React/Redux 将数据发布到 Express。最终，我想存储用户帐户信息，如电子邮件和密码，然后在他们访问网站时对该数据进行身份验证，以允许访问特定信息。

我可以直接从 HTML 发布到服务器，但我认为在使用 React 时我缺少一些额外的步骤。这可能是我卡住的地方。从 React 到 Redux 再到 Express 的数据流是什么？谁能说出一些启示？

我的注册表单组件如下所示：

const RegisterForm = () => {
	return (
		<form 
			method='POST' 
			action='/'
			className="form-group">
				<h1>Sign up!</h1>
				<TextInput placeholder="name" name="name"/>
				<TextInput placeholder="email" name="email"/>
				<TextInput placeholder="password" name="password"/>
				<input type="submit" className="btn btn-primary"/>
		</form>
	);
};

Express 中的 POST 路由是非常通用的 b/c，我想先看看服务器是否正在接收请求。可悲的是，我收到无法/开机自检的消息。

app.post('/', (req, res, next) => {
	console.log('User:', req.body.name);
	res.send('Your sign up was successful!');
});

感谢您的帮助！

Answer 1

删除方法和操作。

有一个名为onSubmit的点击事件，它将侦听提交按钮和触发器名为registerHandler的函数。

<form 
            onSubmit={registerHandler}
            className="form-group">

您可以在此处阅读更多内容。https://reactjs.org/docs/forms.html