React Ajax和jsx

本文介绍了React Ajax和jsx的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我用ajax请求结果填充的数组不会出现在我的React组件无序列表中.

My array that I filled with my ajax request result will not appears in my react components unordered list.

当我执行数组的console.log时，我得到:

When I do a console.log of the array I get:

[]0:职业"

[]0:"Career"

1:中等职业技术学院"

1:"Middle College for Technology Careers"

2:新西兰职业"

2:"Careers New Zealand"

3:职业退伍军人200"

3:"Careers for Veterans 200"

4:北边健康职业高中"

4:"Northside Health Careers High School"

5:芭比的职业"

5:"Barbie's careers"

6:爱德华·肯尼迪健康职业学院"

6:"Edward M. Kennedy Academy for Health Careers"

7:伦敦大学职业小组"

7:"The Careers Group, University of London"

8:职业顾问"

8:"Careers advisor"

9:职业咨询服务"

9:"Careers advisory service"

长度:10

原始:数组[0]

当我在react组件内部调用此数组时，它不会呈现.这是我的下面的代码.

When I call this array inside my react component it does not render. Here is my code below.

HTML

<div id="content"></div>

  //array that the titles will be loaded into
  var response = [];

  $.ajax({
    // request type ( GET or POST )
  type: "GET",

    // the URL to which the request is sent
  url: "https://en.wikipedia.org/w/api.php?",

    // data to be sent to the server
  data: { action:'query', format:'json', list: 'search', srsearch: 'careers', srwhat: 'text', srprop: 'timestamp', continue: ''},

    // The type of data that you're expecting back from the server
dataType: 'jsonp',
crossDomain : true,
// Function to be called if the request succeeds
success: function( jsondata ){

for(var i = 0; i < jsondata.query.search.length; i++){
    //console.log( jsondata.query.search[i].title );
  //pushes each result into the array named list
  response.push(jsondata.query.search[i].title);
}

}
});



 console.log(response)


var App = React.createClass({
render: function(){
//var title = list;
return(
  <div>
  <h1>Hello World</h1>
  <p>The world is full of oppurtunity</p>
    <ul>
      <li>{response[0]}</li>
      <li>Freedom</li>
      <li>Lozve</li>
      <li>Money</li>
    </ul>
    </div>
    );
  }
  });

   ReactDOM.render(<App/>, document.getElementById("content"));

这是我所有代码所在的笔的链接， http://codepen.io /vhall_io/pen/vKQrQN/.我在第一个li标签中插入了response [0]，但它不会渲染.请帮我渲染一下.

Here is a link to my code pen where all my code is, http://codepen.io/vhall_io/pen/vKQrQN/ . I inserted response[0] into the first li tag and it will not render. Please help me render this.

careers

React Ajax和jsx

问题描述

推荐答案