ReactJs Ajax Get

Question

我正在尝试通过单击按钮在 reactJs 组件中执行一个普通的 ajax get 调用。当我尝试使用以下代码时，没有任何反应，但 api 是实时的并且正在工作。它甚至不会将任何内容记录到浏览器控制台。我做错了什么？我是 reactjs 的新手，所以我很抱歉。我正在使用 mvc 5 和 Web API 2 的 reactJS.net。我只是看看我是否可以通过它的路由命中 webapi v2 函数。路由本身本身工作正常，我能够触发断点，但不能从 reactJs onClick 事件触发

var HomeReact = React.createClass({
getInitialState: function () {
    return {
        welcomeMsg: this.props.welcomeMsg,
    };
},
testApi: function () {
    console.log("Clicking");
    $.ajax({
        url: "/api/reg/testapi",
        type: 'GET',
        cache: false,
        dataType: 'json',
        success: function (response) {
            alert(response)
        },
        error: function (error) {
            alert("fail - " + error);
        }
    });
},
render() {
    return (
        <div id="welcomeHolder" align="center">
            {this.state.welcomeMsg}
            <br />
            <button onClick={this.testApi}>React Learning Api Test</button>
        </div>
    );
}

}(;

Answer 1

你的 API 有问题。如果您使用工作网址"https://facebook.github.io/react-native/movies.json",它将起作用。

class Test extends React.Component {
		constructor(props){
    	super(props);
      
      this.state = {
      	welcomeMsg: "Welcome message"
      }
    }
    
    testApi(){
      $.ajax({
          url: "https://facebook.github.io/react-native/movies.json",
          type: 'GET',
          cache: false,
          dataType: 'json',
          success: function (response) {
       				console.log(response);
          },
          error: function (error) {
              alert("fail - " + error);
          }
      });
    }
    
		render(){
    	return (
      	<div id="welcomeHolder" align="center">
            {this.state.welcomeMsg}<br />
            <button onClick={this.testApi.bind(this)}>React Learning Api Test</button>
        </div>
      )
    }
}
React.render(<Test />, document.getElementById('container'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script>
<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

这是小提琴链接。

Answer 2

在这种情况下，

您必须在 ajax 调用中提供完整的 url喜欢这个

网址： "http://localhost:666/api//reg/testapi"，