Question

我有一个常见的表单，我想处理用户输入并保存数据。但由于端点和用户类型不同，我应该使用另一个类将保存功能传递给它。我有保存功能：

const save = async ({ data, props }) => {
  const { match: { params: { userkey } } } = props;
  const { name, selected } = data;
  await rest.post(
    '/v1/distributor/role',
    { key: name, permissions: selected },
    {
      'x-distributor-key': userkey,
    },
  );
};

export default compose(withProps({ save, getPermissions }))(NewRoles);

带有userRole的

来自另一个文件，并在表单中提交创建表单和防火保存功能：

render() {
    const { save } = this.props;
    const { permissions } = this.state;
    console.log(this.props);
    return (
      <div className="col-md-4">
        <Form
          submit={save({ data: this.state, props: this.props })}
          change={this.change}
          nameChange={this.nameChange}
          permissions={permissions}
        />
      </div>
    );
  }
}

这里我将保存功能传递给Form。并且期望在提交时单击使用data和props参数保存功能。但是根据log，保存函数没有传递给函数风格的Form，它传递了一个promise，好像它之前被解雇了：

submit={save({ data: this.state, props: this.props })}

如何传递保存功能以使用该参数提交

Answer 1

你没有传递功能。实际上，您正在调用函数，这意味着您将该函数的返回值（这是承诺）传递给submit prop。所以，改为传递函数。改变

submit={save({ data: this.state, props: this.props })}

到

submit={() => save({ data: this.state, props: this.props })}

传递一个带有参数的函数

1 个答案: