Axios http呼叫每次都被取消,即使它完全适用于浏览器

时间:2018-06-17 12:24:32

标签: javascript reactjs axios

第一次尝试axios和reactjs。这是我的组件CountryListSideBar:

import React, {Component} from 'react';
import 'bootstrap/dist/css/bootstrap.css';
import axios from 'axios';

class CountryListSidebar extends Component {

  constructor(props) {
    super(props);

    this.state = {
      options: []
    };
  }

  componentDidMount() {

    let self = this;
    const config = {
      timeout: 10000
    };

    axios.get('https://localhost:5000/country/getAll', config)
      .then(response => {
        console.log("response returned: " + response.data);
        self.setState({ options: response }) ;
      }).catch(error => {
      console.log("returned error: " + error)
    });
  }


  render() {
    return (
      <ul className="list-group left-side-bar">
        {this.state.options.map(function(object) {
          return (
            <li className="nav-item list-group-item list-group-item-success" value={object.id}>
              <a nav-link href="#">{object.name}</a>
            </li>
          );
        })}
      </ul>
    );
  }

}

export default CountryListSidebar;

我正在使用静态json,它正在运行。然后我决定尝试Axios。当我在浏览器上输入请求地址(localhost:5000 / country / getAll)时,我会在2或3秒内得到json响应。

它捕获console.log中的错误:“错误:网络错误”。这就是我在chrome的网络标签中得到的内容:

getAll  (failed)    xhr xhr.js:178  0 B 79 ms

0 个答案:

没有答案