Javascript 如何捕获用户输入并将其发送到服务器？

这可能已经得到了回答，但我在网上找不到任何关于捕获用户输入并将数据提交到POST请求到服务器的信息

我正在使用materialui/React/JavaScript来实现这一点

<TextField
   id="outlined-email-input"
   label="email name"
   type="email name"
   name="email name"
   autoComplete="email name"
   margin="normal"
   variant="outlined"
   value={this.state.name}
   onChange={this.handleChange('name')}
/>

我还有另一个下拉选择框，允许用户在四种输入之间进行选择

<FormControl>
                      <InputLabel
                        ref={ref => {
                          this.InputLabelRef = ref;
                        }}
                        htmlFor="outlined-password-selection"
                      >
                        Password
                      </InputLabel>
                      <Select
                        value={this.state.age}
                        onChange={this.handleSubmit}
                        input={
                          <OutlinedInput
                            labelWidth={this.state.labelWidth}
                            name="Password"
                            id="outlined-age-simple"
                          />
                        }
                      >
                        <MenuItem value="BLUE">BLUE</MenuItem>
                        <MenuItem value="PINK">PINK</MenuItem>
                        <MenuItem value="GREEN">GREEN</MenuItem>
                        <MenuItem value="YELLOW">YELLOW</MenuItem>
                      </Select>
                    </FormControl>

{
this.InputLabelRef=ref；
}}
htmlFor=“概述密码选择”
>
暗语
蓝色
粉红色
绿色
黄的

基本上，我希望用户输入他们的电子邮件并选择密码，然后在POST请求中使用此信息。为了简化这一过程，我想捕获用户输入，只需console.log（）就可以了。如何执行此操作？

您可以创建一个

onSubmit

事件处理程序并将其附加到表单。一旦表单被提交，那么在处理程序中您将拥有所有表单值，并且您可以触发POST请求

下面是一个完整且有效的反应示例：

类表单扩展了React.Component{
建造师（道具）{
超级（道具）；
this.state={}
this.handleInputChange=this.handleInputChange.bind（this）
this.handleSubmit=this.handleSubmit.bind（this）
}
handleSubmit（事件）{
console.log（'表单数据：'，this.state）
event.preventDefault（）
}
//动态注册和设置表单字段值和名称
handleInputChange（事件）{
const target=event.target
const value=target.type=='checkbox'？target.checked:target.value
const name=target.name
这是我的国家({
[名称]：值
})
}
render（）{
返回(
电邮：


密码：


提交
)
}
}
ReactDOM.render(
,
document.getElementById（'容器'）
)

像任何表单一样，在提交时创建您的帖子，或者您可以收集输入值，然后单击任何内容创建帖子。@Adrian Markoe，请检查一下好吗？如果你有问题，请随时提问。