無法重新渲染子組件reactjs

Question

美好的一天。 狀態更改后，我無法重新渲染子組件。

export default class Featured extends React.Component {

constructor(){
  super()
  this.state = {
    result: []
  }
}

componentDidMount(){
  $.ajax({
    type: "GET",
    dataType:'JSONP',
    beforeSend: function (request){
      request.setRequestHeader("Authorization", Config.key);
    },
    url: "myUrl",
    success: function(data) {
      this.setState({
        result: data.users
      });
      console.log(this.state.result);//here i got my Array
    }.bind(this)
  });
}

componentWillUnmount(){
  this.serverRequest.abort();
}

render() {
  return (
    <div class="">
      <div class="row">
        <Card data={this.state.result} />
      </div>
    </div>
  );
 }
}

當ajax請求成功時，我更改了狀態，但我不知道如何重新渲染組件。 這是一些代碼

export default class extends React.Component {

render() {
  console.log(this.props.data);
  return (
    <div class="flex-container">
      { 
        this.props.data.map(function(item, index) {
          return <div class="col-xs-12 col-sm-6 col-md-12" key={item._id}>

我錯過了什么？ 這是控制台屏幕http://prntscr.com/ap24x5

Answer 1

您的語法不正確，但我很快就會發現：

• 您不能在render函數中使用class，而必須使用className

• 您的第二個組件的語法不正確，您需要將其命名為：

  export default class MyComponent extends React.Component {

由於JSX是JavaScript，因此不建議將諸如class和for之類的標識符用作XML屬性名稱。 相反，React DOM組件期望DOM屬性名稱分別為className和htmlFor。