ReactJs:如何在渲染组件时传递初始状态?

And*_*ena 18 javascript reactjs

我知道我可以props在渲染组件时通过.我也知道这个getInitialState方法.但问题是,getInitialState并不是很有帮助,因为我的组件不知道它的初始状态.我做.所以我想在渲染时传递它.

像这样的东西(伪代码):

React.render(<Component initialState={...} />);
Run Code Online (Sandbox Code Playgroud)

我知道我可以使用a prop作为初始状态,但这闻起来像一个反模式.

我该怎么办?

编辑清晰度

想象一下,我有一个CommentList组件.到我第一次渲染它时,初始状态对应于我数据库中当前注释的快照.当用户包含评论时,此列表将会更改,这就是为什么它应该是a state而不是props.现在,为了呈现注释的初始快照,我应该将它传递给CommentsList组件,因为它无法知道它.我的困惑是,我看到传递这些信息的唯一方法是通过一个props似乎是反模式的方式.

teb*_*oso 14

只有永久性组件才能使用道具getInitialState.getInitialState如果同步是您的目标,则道具输入是反模式.getInitialState仅在首次创建组件时调用,因此它可能会引发一些错误,因为事实来源并不是唯一的.检查这个答案.

引用文件:

使用从父进行传递的props,在getInitialState中生成状态通常会导致"真实来源"的重复,即真实数据的位置.在可能的情况下,即时计算值以确保它们以后不会失去同步并导致维护问题

你仍然可以这样做:

getInitialState: function() {
   return {foo: this.props.foo}
}
Run Code Online (Sandbox Code Playgroud)

因为它们将成为您应用的默认道具.但只要您使用prop来设置一个可能不会改变的值,您就可以在render函数内部使用相同的prop .

<span>{this.props.foo}</span>
Run Code Online (Sandbox Code Playgroud)

这个道具不会被修改,因此每次render调用时都没有问题.

编辑答案:

在这种情况下,您的初始状态不应该是prop,应该是填充注释列表的ajax调用.