上传文件reactjs err 400

Question

当我尝试上传文件时出现此错误未捕获（承诺中）错误：请求失败，状态码为 404"。我不明白为什么。这是我的一段代码。        import React, {Component}from 'react';    import '../css/formLocation.css';    import axios from 'axios'        class FormLocation extends Component {      constructor(props) {        super(props);        this.state = {           file : null         }      }              handleClick9 = (e) => {      e.preventDefault();      this.setState({step9 : true})      const formData = new FormData();      formData.append('images' , this.state.media)      axios.post('http://localhost:1337/testmedias/', formData)        .then((response) => {          console.log(response);        })      }                  handleChangefile = e => {      this.setState({        media : e.target.files[0]      })      }            render() {         return (           <form>          <div className='form' id='input' >                           <h6 className={this.state.step9? 'true': 'false'}>Ajoutez des images ?</h6>              <input type='file' name='media' className='input' onChange={this.handleChangefile}/>              <br/>              <button onClick={this.handleClick9} >Soumettre</button>          </div>      </form>         );      }    }     export default FormLocation;我正在为 API 使用 Strapi。先感谢您。

Answer 1

我不认为你的代码有问题。它给出了 404 的错误，这意味着没有您调用的 API。

Answer 2

尝试这样的事情

import React, {Component}from 'react';

    import '../css/formLocation.css';

    import axios from 'axios'

    class FormLocation extends Component {

      constructor(props) {

        super(props);

        this.state = { 

          file : null

         }

      }

      handleClick9 = (e) => {

      e.preventDefault();

      this.setState({step9 : true})

      const formData = new FormData();

      formData.append('images' , this.state.media)

      axios.post(`'http://localhost:1337/testmedias/'${formData}`)

        .then((response) => {

          console.log(response);

        })

      }  

      handleChangefile = e => {

      this.setState({

        media : e.target.files[0]

      })

      }

      render() { 

        return ( 

          <form>

          <div className='form' id='input' >

              <h6 className={this.state.step9? 'true': 'false'}>Ajoutez des images ?</h6>

              <input type='file' name='media' className='input' onChange={this.handleChangefile}/>

              <br/>

              <button onClick={this.handleClick9} >Soumettre</button>

          </div>

      </form>

         );

      }

    }

export default FormLocation;