javascript - 销毁 react Prop 中的es6默认值

Question

<ComponentB from="3/1/2016" to="12/1/2016" />

在 componentB 的构造函数中我可以做

const { from, to } = this.props但我的 from to value 是可选的。我做不到

this.state = { from, to }如果它们是或为空。有什么方法可以设置销毁的默认值？

我能做到if(from && to) {}但只是好奇在 React 中处理可选 Prop 的最佳方式是什么。

Answer 1

您可以使用以下两种方式中的任何一种:

1. 在解构期间为变量分配默认值，如下所示:

const { from = 'abc', to ='abc' } = this.props;

如果 this.props 不包含任何键，它将采用默认值“abc”。

2. 使用 defaultProps 将默认值分配给 props 变量，如下所示:

ComponentName.defaultProps = {
    from: 'abc',
    to: 'abc'
};

从父组件传递的所有 props 都将被分配这些默认值。

检查这个例子:

var obj = {a: 1, b: 2, c: 3};

var {a=5, b=5, d=5} = obj;

console.log(a, b, d);