返回Axios数据,但调用代码不起作用

时间:2016-12-23 17:35:06

标签: reactjs ecmascript-6 axios

提前感谢您的阅读。我对反应和es6世界都是新手。我有一个使用axios调用api的工作组件。都好。重新设计它以将冗余的api调用代码放入工具中,并从需要数据的任何地方调用它。但我无法弄清楚为什么这个函数调用不起作用。有人看到我错过了吗?

这是效用函数:

${ x;p; }

这是调用反应组件:

import Axios from 'axios';

export function getData(strPath){
    var sendToken = {
      headers: {'Authorization': 'Token tokenHere'}
    };
    var sendPath = "http://pathHere.com/api/" + strPath

  Axios
    .get(sendPath,sendToken)

    .catch(function (error) {
      //error handling here
      })
    .then(function (response) {
      console.log(response.data.results) //outputs my array of 2 elements
      return(response.data.results);
    })
};

1 个答案:

答案 0 :(得分:2)

实用程序:

import Axios from 'axios'

export function getData(strPath){
    const sendToken = {
      headers: {'Authorization': 'Token tokenHere'}
    }
    const sendPath = "http://pathHere.com/api/" + strPath
    return Axios.get(sendPath, sendToken)    
};

组件:

import React, { Component } from 'react'
import { getData } from './Utils'

class BoardContainer extends React.Component {
  constructor(props){
    super(props);
    this.state = { positions: [] }
  }

  componentWillMount(){
    getData('positions').then((response) => {
        console.log(response)
    }).catch((error) => {
        console.log(error)
    })     
  }

  render() {
    return(
      <div>Testing Rendering Board Container
        //rendering code would be here (child component call)
      </div>
    )
  }
}