Question

我的组件

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查询。因此，我需要将refetch函数发送到我的uploadFile。我该怎么办？

Answer 1

我认为这样做：

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

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

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

Answer 2

0xc14m1z的答案正确。

这是一种“更清洁”的语法，可通过预先配置功能来解决您的问题：

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

还有您的功能：

uploadFile = async refetch => event => {

从<input /> onChange函数发送函数

2 个答案: