javascript - 如何从 Reactjs 调用 Web 服务

标签 javascript http reactjs

我正在研究将 Reactjs 与 webpack 结合使用的示例。如何从 reactjs 组件调用 webservice 并将结果传递给 html 文件

我尝试了 superagent、http-browserify 等 他们都给我同样的错误:

Uncaught TypeError: Cannot read property 'get' of undefined.

下面是我调用 API 的 View 组件

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);
                    }
        })

  }

};

最佳答案

回调函数的签名是 (err, res) 将您的代码更改为该签名并更改评论中提到的导入语句,它应该可以工作

关于javascript - 如何从 Reactjs 调用 Web 服务,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33006976/

相关文章:

angularjs - React redux oop 类

spring - Spring 休息中的健康或状态端点

javascript - 无法导入工作,JavaScript w/ReactJS & ES6/ES2016

javascript - 如何将两个16位整数(高位字/低位字)转换为32位 float ?

javascript - 如何在每次滚动时触发此动画

javascript - 如何将 JSON 中的正则表达式传递给 API?

javascript - 'slider angle' 单击小图像返回相应的大图像

json - AFNetworking 2.0/Boost::Asio - 获取 JSON 数据(网络连接丢失)

android - Retrofit 2 检查调用 URL

javascript - 从三个叠瓦组件中获取 Prop