将页面存储在无限卷轴的道具中进行反应

Question

我对reactjs很新。我已经实现了无限的可滚动列表，为所选类别加载新主题。我将页面存储在道具中，并在我们滚动到页面底部时使用this.props.pageNo = this.props.pageNo + 1直接更改它。

var TopicList = React.createClass({
  getDefaultProps: function() {
    return { page: 0 }
  },
  getInitialState: function() {
    return {
      topics: []
   }
  },
  loadMoreTopics: function(event) {
    var main_section = event.target;
    var scroll = (main_section.scrollHeight - main_section.scrollTop) < (main_section.scrollHeight/2);
    if(scroll) {
      this.props.page = this.props.page + 1;
      this.loadTopics(); // inside loadTopics I am using this.props.page to send the ajax request
    }
  },
  render: function() {
    return (
      <div className="main-section" onScroll={this.loadMoreTopics}>
        {this.props.topics.map(function(topic) {
          <Topic topic={topic}/>
        }
      </div>
    )
  }
});

关于上述代码我几乎没有问题。

1）将这些信息（pageNo）存储在道具中或者我应该使用状态是否合适？我认为它应该是作为App组件的私有状态，并且永远不会从任何父组件传递给App组件。

2）如果我使用state来存储pageNo，那么我可以在不使用setState的情况下使用this.state.pageNo = this.state.pageNo + 1，因为我不想在更改pageNo时重新渲染组件，但是在调用loadtopics（）之后应该重新渲染主题状态已更新。我知道this.state.pageNo = this.state.pageNo + 1有效，但我想知道这是否是正确的方法。

注意：当pageNo更改时，我不想重新渲染。