reactJS：是否需要定义初始状态？

Question

在从设置它的某个东西获取状态之前定义初始状态形状（包含所有可能的嵌套值）感觉很麻烦。我想知道我是否需要设置初始状态形状或是否有一些方法。

this.state = {}

如果我有这个状态，然后我有一个试图阅读state.post的JSX对象，它将失败，cannot read property "posts" of undefined

<PostDiv post={this.state.post} />

有没有办法避免定义初始状态形状，还避免错误？我知道我可以这样做......

{ this.state.post && <PostDiv post={this.state.post} /> }

但最终会像定义我想要避免的初始状态一样冗长。

Answer 1

如果您将州定义为：

this.state = {};

并尝试访问this.state.post它不会在此处抛出任何错误，因为状态已定义且this.state.post未定义。

检查此代码段：

let state = {};

console.log('post = ', state.post);

但是，如果您尝试访问this.state.post的任何属性，则会抛出此错误：

  

无法读取未定义

的属性“帖子”

我认为在您的情况下，此错误来自组件PostDiv，您尝试访问从父级传递的帖子道具的某些值。

所以可能的解决方案是：

1.定义post in state变量的初始值。

2.使用条件渲染

3.写成这样：

<PostDiv post = { this.state.post || {} } />

最后一个如果帖子存在，那么它的值会被传递，否则默认值将是{}。