React特征学习之Form格式示例详解_React_

import * as React from 'react'; const LoginForm = () => { return ( 
 // Notice: 这里要用htmlFor，相当于id Email
Password
Submit
 ); }; export { LoginForm }; 

import * as React from 'react'; const LoginForm = () => { // handleSubmit here const handleSubmit = (e) => { // preventDefault用于防止部分浏览器一些默认的不必要的行为 event.preventDefault(); }; return ( // onSubmit here 
Email
Password
Submit
 ); }; export { LoginForm }; 

import * as React from 'react'; const LoginForm = () => { const handleSubmit = (e) => { e.preventDefault(); // 获取input elements const email = e.target.elements.email.value; const password = e.target.elements.password.value; alert(email + ' ' + password); }; return ( 
Email
Password
Submit
 ); }; export { LoginForm }; 

import * as React from 'react'; const LoginForm = () => { // Add hooks here const [email, setEmail] = React.useState(''); const [password, setPassword] = React.useState(''); const handleEmail = (e) => { setEmail(e.target.value); }; const handlePassword = (e) => { setPassword(e.target.value); }; const handleSubmit = (e) => { e.preventDefault(); alert(email + ' ' + password); }; return ( 
Email
Password
Submit
 ); }; export { LoginForm };