如何从Reactjs调用Web服务

时间:2015-10-08 04:59:08

标签: javascript http reactjs

我正在研究我正在使用带有webpack的Reactjs的示例。如何从reactjs组件调用web服务并将结果传递给html文件

我试过superagent,http-browserify等 所有这些都给了我同样的错误:

  

未捕获的TypeError:无法读取未定义的属性“get”。

以下是我调用API的视图组件

import React from 'react'
import FindpersonStore from'../stores/FindPersonStore';
import PersonAPI from'../utils/PersonAPI';

var FindPerson = React.createClass({
    handleGoClick()
    {
        PersonAPI.getPerson(this.refs.personIdInput.getDOMNode().value);
    },

    render(){

         return(
        <div>
            <p>person Id <input type="number" value={this.props.personId} ref="personIdInput" /></p>    
            <input type="Submit" onClick={this.handleGoClick}/>
        </div>
        );
    }
});
export default FindPerson

API是

import FindPersonAction from'../actions/FindPersonAction';
import {request} from 'superagent';

module.exports = {

  // Load mock product data from localStorage into ProductStore via Action
  getPerson: function(personId) {
    var url = "http://localhost:8080/SampleWebService/service/find?id="+personId

    request
        .get(url)//This is giving me error
        .end(function(res){
            if (res.status === 404) {
                        reject();
                    } else {
                         var data = JSON.parse(res);
                         FindPersonAction.findPerson(data);
                    }
        })

  }

};

1 个答案:

答案 0 :(得分:0)

回调函数有签名(错误,res) 将您的代码更改为该签名&amp;更改注释中提到的import语句,它应该可以正常工作