javascript - React Js 调用另一个传递 props 的函数

Question

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

这是我的常用组件，其中有以下组件，其名称为 TestComp，它接受一些 Prop ，其中一个是函数 handleChange。

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

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

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

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

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

所以，我尝试将另一个函数作为 props 传递。

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}/>