装饰器或父属性的属性和状态？

Question

我需要知道什么是最方便的实施方式。在我的例子中，父组件和子组件使用相同的属性和状态。我怀疑是：

1。从父组件传递属性。

2。使用装饰器在子组件中设置属性值。

不同案例的优缺点？谢谢！

Answer 1

您发现的是组件和容器之间的区别。容器就是你所说的“装饰器”而组件就是那些没有的装饰器。关于这些主题的最佳实践有一个很多讨论，这些关键字应该可以很容易地找到很多意见。

通常，标准是您应该优先考虑容器上的组件。如果以正确的方式创建，组件是抽象的和可重用的。例如，给出你的第一个例子，我会略微修改它看起来更像这样;

class ComponentParent extends React.Component {

    //...

    render() {
        <ComponentChildren onSomeEvent={this.props.optionActions.anyAction}/>;
    }
}

class ComponentChildren extends React.Component {

    //...

    someMethod() {
        this.props.onSomeEvent();
    }
}

以这种方式编写时，ComponentChildren现在可以重复使用，并提供onSomeEvent的新定义，以便以新的方式与您的应用互动。以此样式构建所有组件最终将导致类似库的代码库，其中代码极其可重用。