用文件提交反应表单

Question

我现在正在练习使用Reactjs 上传文件。这是一个简单的问题，但我无法将解决方案连接到axios。我知道state 和Form 是如何工作的，但是我的JavaScript 回调值不包含我给定的任何输入。或者我找不到我的values。这是我的情况。

import React, {Component, Fragment} from 'react';
import tokamakConfig from './Configuration_icon_by_obsilion.png';
import {Form} from 'semantic-ui-react';

class Advance extends Component {
  handleSubmit(event, values){
    console.log(event);
    console.log(values);
  }

  render() {
    return (
      <Fragment>
        <h1>Please provide necessary information for the operation</h1>
        <img src={tokamakConfig} alt={'tokamak configuration'} />
        <Form onSubmit={this.handleSubmit}>
          <Form.Group inline>
            <label>Load input file</label>
            <input name={'file'} type='file' />
          </Form.Group>

          <Form.Group inline>
            <label>Comment</label>
            <input name={'comment'} type={'text'} placeholder={'This is an advanced mode'}/>
          </Form.Group>
          <button type={'submit'}>Submit</button>
        </Form>
      </Fragment>
    )
  }
}

export default Advance;

在我的console.log()。我得到了proxy 对象和onSubmit 对象。我在那里找不到我的任何输入。然后我不知道如何将我的值发送给axios

问题：
如何将POST文件从form转为endpoint

Answer 1

<input type="file" onChange={ (e) => this.handleChange(e.target.files) } />

您需要使用 onChange 事件来获取文件数据。

handleChange(selectorFiles: FileList)
    {
        console.log(selectorFiles);
    }

那你需要获取方法里面的文件信息