从 <input> onChange 函数发送函数答案

【问题标题】：Sending a function fron <input> onChange function从 <input> onChange 函数发送函数
【发布时间】：2019-06-04 04:22:49
【问题描述】：

我的组件：

class Admin extends React.Component {
  constructor(props) {
    super(props);
  }

  uploadFile = async (event, refetch) => {
    await uploadFileToBucket(event, true);
    refetch(); // refetch is undefined
  };

  render() {
    return (
     <GraphQlDataFetcher query={getObjectsInDefaultBucket()}>
        {(data, refetch) => (
           <Files files={data.bucketObjects}/>
            <input type="file" onChange={(refetch) => this.uploadFile(event, refetch)}/>

          )}
       </GraphQlDataFetcher>

    );
  }
}


export default Admin

文件上传完成后，我想重新获取graphql-query。所以我需要将 refetch 函数发送到我的uploadFile。我该怎么做？

【问题讨论】：

输入 onChange 只给你事件而不是重新获取。要获取最新数据，请像执行 uploadFileToBucket 一样获取调用

标签： reactjs graphql graphql-js

【解决方案1】：

我认为这样做：

<input type="file" onChange={ (refetch) => this.uploadFile(event, refetch) } />

您正在覆盖GraphQlDataFetcher 传递的refetch 方法，您可以尝试这样做吗？

<input type="file" onChange={ event => this.uploadFile(event, refetch) } />

【讨论】：

【解决方案2】：

0xc14m1z 的答案是正确的。

这里有一个“更简洁”的语法，通过预配置你的函数来解决你的问题：

<input type="file" onChange={this.uploadFile(refetch)} />

还有你的功能：

uploadFile = async refetch => event => {

【讨论】：