对于jQuery AJAX调用,不会触发componentDidMount

时间:2016-09-29 20:26:50

标签: ajax reactjs

我有以下代码:

import React from 'react';
import {render} from 'react-dom';

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
          data: ''
        };
    }
    componentDidMount () {
      $.get(this.props.source, function(result) {
        this.setState({data: result});
      }.bind(this));
    }
    render () {
        return (
            <div>
                <p>{this.state.data}</p>
            </div>
        )
    }
}

render(<App source='https://s3-eu-west-1.amazonaws.com/streetlife-coding-challenge/newsfeed.json'/>, document.getElementById('app'));

的package.json:

{
  "name": "streetlife",
  "version": "1.0.0",
  "description": "technical test for streetlife",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.16.0",
    "babel-loader": "^6.2.5",
    "babel-preset-es2015": "^6.16.0",
    "babel-preset-react": "^6.16.0",
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "webpack": "^1.13.2"
  }
}

我希望在我的&#34; p&#34;中呈现json数据。标签,但屏幕是空的,我都没有错误。

1 个答案:

答案 0 :(得分:1)

好吧,我将你的代码粘贴到JSBin中以查看发生了什么,但显然它有效。这里是code working。也许这与你的环境有关吗?