javascript - defaultProps 在 ReactJs 中有效吗

Question

我正在遵循一个教程，他们设置了一个名为 defaultprops 的静态对象，设置后 this.props 可以在相同的情况下使用组件，为什么这是可能的，我的意思是 static defaultProps 的功能是什么，它是 React 中的内置函数吗？

class TestComponent extends Component {
    static defaultprops = {
        food: ["goatmeat", "yam"]
    }

    render() {
        let categories = this.props.defaultprops.food.map(foods => {
            return <option key={foods}>{foods}</option>
        });

        let {test} = this.props;

        return (
            <p>
                {this.props.test}
            </p>
        );
    };
}

Answer 1

默认 props 很好，因为在将它们传递给组件时不必指定所有 props。顾名思义，它允许您为 Prop 设置良好的默认值，即使未传入覆盖值，也会使用这些默认值。请记住，忽略该 Prop 将导致使用默认值，而传入 null 将导致使用 null 值。

更多信息可以找到here .

编辑
要更明确地回答提出的问题:

这是可能的，因为这就是 React 的工作原理。这是为了程序员和逻辑方便而内置的功能。

对于TestComponent在您的示例中，假设它在另一个组件中使用。如果你只是使用<TestComponent /> ，该组件将具有 food ["goatmeat","yam"] 的值。但是，您始终可以根据需要在调用时为 prop 传递不同的值来覆盖它。例如，您可以使用 <TestComponent food={["cheese", "eggs", "cabbage"]}/> 。这将导致组件的此实例具有 food ["cheese", "eggs", "cabbage"] 的值.

我认为这也是一个很好的注意点，它应该是 defaultProps而不是defaultprops因为我相当确定大小写问题，但如果有人想纠正我，我很乐意编辑这一点。