Как получить события obSubmit и onChange для загрузки файла в форму в реагировать, материал-интерфейс? - PullRequest
0 голосов
/ 06 января 2019

Я создаю простой компонент React. Он имеет кнопку Upload, которая загружает файл. Я не могу заставить onSumbit выстрелить в моем текущем коде:

import React from 'react';
import PropTypes from 'prop-types';
import Typography from '@material-ui/core/es/Typography/Typography';
import Button from '@material-ui/core/es/Button/Button';
import { UploadCSVstyles } from '../styles/Material-UI/muiStyles.js';
import withStyles from '@material-ui/core/es/styles/withStyles';

import * as log from 'loglevel';
log.setLevel("debug");

class UploadCSV extends React.Component {
  state = {
    uploadedFile: null
  }

  onSubmit = e => {
    e.preventDefault();
    log.debug('from submit');
    this.setState({
      uploadedFile: e.target.files[0]
    });
  }

  onChange = e => {
    log.debug('from change');
    this.setState({
      uploadedFile: e.target.files[0]
    });
  }

render() {
    const { classes } = this.props;
    return (
      <div>
        <Typography>
          You can upload a CSV file containing app id's in one columns.
        </Typography>
        <input
          accept="text/csv"
          className={classes.input}
          id="contained-button-file"
          multiple
          type="file"
          onChange={this.onChange}
        />
        <label htmlFor="contained-button-file">
          <Button variant="contained" component="span" className={classes.button}>
            Choose files
          </Button>
        </label>
        <form onSubmit={this.onSubmit}>
          <Button variant="contained" component="span" className={classes.button}
                  type="submit">
            Upload
          </Button>
        </form>
      </div>
    );
  }
}

UploadCSV.propTypes = {
  classes: PropTypes.object.isRequired
};

export default UploadCSV;

Проблема, я думаю, с кнопкой Material-UI, потому что она как-то не срабатывает onSubmit. Как заставить событие onSubmit работать с Material-UI Button?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...