루프와 ajax 요청을 통해 반응 상태를 설정하려고 시도합니다.

반응이 반복되어 루프와 아약스 요청을 속이고 있습니다. 작동하지 않는 것 같습니다. 루프를 반복하고, 객체 배열을 설정 한 다음, 나중에 사용할 수 있도록 해당 객체 배열을 상태로 푸시한다고 가정합니다.루프와 ajax 요청을 통해 반응 상태를 설정하려고 시도합니다.

문제는 내가 일반적으로 약속을 지키지 못하고 있다는 것입니다. this concept from the react docs을 사용하여 마운트 할 때 구성 요소의 상태를 설정하여 "링크"의 배열을 반환합니다.

/** @jsx React.DOM */ 

var Temp = { 
    object: new Array() 
} 

var CommentsRow = React.createClass({ 

    getInitialState: function(){ 
    return { 
     href: '' 
    } 
    }, 

    componentDidMount: function(){ 
    var self = this 
    this.props.comments.slice(0, 5).map(function(comment){ 
     var postUrl = window.Development.API_URL + 'posts/' + comment.post_id 

     $.get(postUrl, function(post){ 
     Temp.object.push(post.post.title); 
     if (self.isMounted()) { 
      self.setState({ 
      href: Temp.object 
      }); 
     } 
     }); 
    }); 

    }, 

    render: function() { 
    console.log(this.state) 
    } 
});

위의 세드릭의 요지는 다음과 같습니다

내가 들어오는 코멘트 무리가 내가 처음 다섯을. 거기에서 각 주석 객체를 반복하고 제목을 가져 와서 내 API 링크를 만듭니다. 그것으로 나는이 링크를 기반으로 한 게시물을 얻고, 임시 객체를 설정하려고한다고 가정하고 1,2,3,4 및 마지막으로 5의 수에서 각각 "5 개의 배열"을 만듭니다. 집단.

거기에서 우리는 그 상태를 설정합니다. 이 부분은 작동하지만 Ajax가 상태를 요청하기 때문에 if (isMounted()){ ... } 옵션을 사용하더라도 요청이 비어 있습니다.

어떻게 이런 식으로 상태를 설정할 수 있으며 여전히 그것에 대한 액세스 권한이 있습니까?

출처

2014-12-19 TheWebs

async.js을 원하거나 여러 비동기 작업을 관리 할 것을 약속해야합니다. 비동기는 jQuery와 조금 더 잘 통합되어 있으므로이를 함께 보여 드리겠습니다.

componentDidMount: function(){ 
    async.map(this.props.comments.slice(0, 5), function(comment, cb){ 
    var postUrl = window.Development.API_URL + 'posts/' + comment.post_id; 
    $.get(postUrl, function(data){ 
     cb(null, {title: data.post.title, href: ???}); 
    }); 
    }, function(err, posts){ 
    // posts is an array of the {title,href} objects we made above 
    this.setState({posts: posts}); 
    }.bind(this)); 
}

출처

2014-12-19 06:25:41 FakeRainBrigand

루프와 ajax 요청을 통해 반응 상태를 설정하려고 시도합니다.

답변

관련 문제