ReactJS状态与属性

这可能会在负责任和有见识之间走出一条界限，但是我将反复讨论如何随着复杂性的增加和使用某些方向来构建ReactJS组件。

来自AngularJS，我想将模型作为属性传递到组件中，并让组件直接修改模型。还是应该将模型拆分为各种state属性，并在向上游发送回来时一起重新编译？什么是ReactJS方式？

以博客文章编辑器为例。试图直接修改模型最终看起来像：

var PostEditor = React.createClass({
  updateText: function(e) {
    var text = e.target.value;
    this.props.post.text = text;
    this.forceUpdate();
  },
  render: function() {
    return (
      <input value={this.props.post.text} onChange={this.updateText}/>
      <button onClick={this.props.post.save}/>Save</button>
    );
  }
});

好像错了

是否更像React的方式来制作text模型属性state，并在保存之前将其编译回模型中：

var PostEditor = React.createClass({
  getInitialState: function() {
    return {
      text: ""
    };
  },
  componentWillMount: function() {
    this.setState({
      text: this.props.post.text
    });
  },
  updateText: function(e) {
    this.setState({
      text: e.target.value
    });
  },
  savePost: function() {
    this.props.post.text = this.state.text;
    this.props.post.save();
  },
  render: function() {
    return (
      <input value={this.state.text} onChange={this.updateText}/>
      <button onClick={this.savePost}/>Save</button>
    );
  }
});

这不需要调用this.forceUpdate()，但是随着模型的增长，（帖子可能会有作者，主题，标签，评论，评分等），该组件开始变得非常复杂。

使用ReactLink的第一种方法是可行的吗？