React Js 调用另一个传递道具的函数

Question

我是 react js 和 redux 的新手。 在这里，我在两个不同的地方使用相同的组件，并将一些函数作为道具传递。

这是我的通用组件，其中我有以下组件，其名称为 TestComp，并且接受一些道具，其中一个是函数 handleChange。

<SelectFileButton
    accept='application/pdf'
    handleSubmit={file => handleSubmit(file, 'test')}
/>

现在，该组件具有 handleChanges 方法的实现。 现在，我从另一个地方使用相同的组件。

<TestDocument
    handleSubmit={file => actionFunction(URL,file)}
/>

现在这个组件有它自己的 handleSubmit 函数的实现。 那是在同一个组件中。

现在，我正在尝试的是在将道具传递给函数时，我正在调用其中的另一个函数，该函数也不会破坏另一个组件的实现。

所以，我尝试的是将另一个函数作为道具传递。

const actionFunction = (URL,file) => {
    this.handleSubmit()
}

<TestDocument
    handleSubmit={file => actionFunction(URL,file)}
/>

那么，我可以做些什么来使用它吗？

Answer 1

如果我理解正确的话。 你需要试试这个

export default function TestDocument (props) {
  return (
    <form handleSubmit={file => props.handleSubmit(URL,file)}>
       ...
    </form>
  );
}

渲染测试文档：

 <TestDocument handleSubmit={this.handleSubmit}/>