Witam. Zastanawiam się czy renderowanie Container/Smart/StateFull komponentu, w komponencie prezentacyjnym/dumb jest anty-paternem?. Czy są jakieś przeciwwskazania?, zastanawiam się czy wtedy ten podział nie traci sensu.
class SmartCmp extends Component {
state = { smart: true };
render() {
return <p onClick={() => this.setState({ smart: false })}>bez znaczenia</p>;
}
}
const DumbCmp = () => (
<div>
<h1>Komponent prezentacyjny</h1>
<p>poniżej renderuje smart/state-full/container </p>
<SmartCmp />
</div>
);
A może lepszym rozwiązaniem jest taki pseudo HOC prezentacyjny?.
class SmartCmp extends Component {
state = { smart: true };
render() {
return <p onClick={() => this.setState({ smart: false })}>bez znaczenia</p>;
}
}
const DumbCmp = (props) => (
<div>
<h1>Komponent prezentacyjny</h1>
<p>poniżej renderuje smart/state-full/container </p>
{props.children}
</div>
);
class ParentSmartCmp extends Component {
render() {
return (
<DumbCmp>
<SmartCmp />
</DumbCmp>
);
}
}
Chętnie się dowie co sądzicie na ten temat. Które rozwiązanie według was jest lepsze?, i które powinno się stosować.