1

Criei um componente React para ser meu botão personalizado de input:

getFormData(){
    var formData = new FormData();
    var imagefile = document.querySelector('#btn_file_logo');
    formData.append("image", imagefile.files[0]);
    return formData;
}

render() {
    return (
        <div>
            <div className="logo_input" onClick={() => this.abirInputFile()}><i className="fa fa-upload"> </i> {this.props.texto}</div>
            <input type="file" className="form-control-file" id="btn_file_logo" name="btn_file_logo"  />
      </div>
    );
}

Porem estou com dificuldade para utilizar o formData. A função getFormData() deve retornar o formData para outro componente, que vai pega-lo e adicionar com append o restante dos parâmetros que serão enviados ao servidor(utilizo PHP com o Slim Framework no server-side):

cadastrar(){
    this.refs.load.openLoad();

    var formData = this.refs.input_logo.getFormData();
    formData.append('nome',this.state.nome);
    formData.append('cnpj',this.state.cnpj);

    axios.post(config.urlBase + 'adicionar_empresa', {empresa:formData}).then(res => {
      if(res.data.status){
        this.refs.sucesso.openSucesso(2000);
        this.refs.load.closeLoad();
        this.limparCampos();
      }else{
        this.refs.erro.openErro(3000);
        this.refs.load.closeLoad();
      }
    })
}

O problema é que no servidor chegam vazios os parâmetros.

inserir a descrição da imagem aqui

1 Resposta 1

0

Consegui resolver

axios.post(config.urlBase + 'adicionar_empresa', {empresa:formData})

estava passando o parâmetro em JSON, o correto é assim

axios.post(config.urlBase + 'adicionar_empresa', formData)

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .