javascript - 如何在自定义组件内处理 onSubmit

Question

我的自定义组件有 onChange 事件，该事件运行得很好，但是当我尝试 onSubmit 时，它不起作用。警报不显示。

目前，我的数据提供程序从输入中获取除自定义组件之外的所有值，我应该做什么？代码有什么问题吗？可以将数据从此自定义组件传递到父表单吗？

家长表格:

export const smthEdit = props => (
    <Edit {...props} title={<smthTitle/>} aside={<Aside />}>
        <SimpleForm>
        <DisabledInput source="Id" />
        <TextInput source="Name" />
        <ReferrenceSelectBox label="Socket" source="SocketTypeId" reference="CPUSocketType"></ReferrenceSelectBox>
        <DateField source="CreatedDate" showTime
            locales={process.env.REACT_APP_LOCALE}
            disabled={true} />
        </SimpleForm>
    </Edit>
);

我的自定义组件(ReferrenceSelectBox):

  handleSubmit(event) {
    alert('smth');
  }

  render() {
    return (
      <div style={divStyle}>
        <FormControl onSubmit={this.handleSubmit}>
            <InputLabel htmlFor={this.props.label}>{this.props.label}</InputLabel>
            <Select
              multiple
              style={inputStyle}
              value={this.state.selectedValue}
              onChange={this.handleChange}
            >
              {this.renderSelectOptions()}
            </Select>
        </FormControl>
      </div>
    );
  }

Answer 1

错误是将 FormControl 更改为表单

<form onSubmit={(event) => this.handleSubmit(event)}>
            <InputLabel htmlFor={this.props.label}>{this.props.label}</InputLabel>
            <Select
              multiple
              style={inputStyle}
              value={this.state.selectedValue}
              onChange={this.handleChange}
            >
              {this.renderSelectOptions()}
            </Select>
        </form>