..................
const c1 = <h2>'AZAZA'</h2>;
const c2 = <div>{c1}</div>;
.................
return (
<div>
{c2}
</div>
);class Example extends Component {
renderA = () => {
// Достали весь JSON пропсов
const { data } = this.props;
// если нет данных для блока А - не рисуем его
if (!data.a) return null;
// данные есть, значит рисуем один из "кубиков"
return (
<ComponentA data={data.a} />
)
};
renderB = () => {
// Достали весь JSON пропсов
const { data } = this.props;
// если нет данных для блока B - не рисуем его
if (!data.b) return null;
// данные есть, значит рисуем один из "кубиков"
return (
<ComponentB data={data.b} />
)
};
render() {
return (
<div>
// Тут можно делать любую вёрстку, в нужные места вставлять вызов this.renderSomething
{this.renderA();}
{this.renderB();}
</div>
)
}
}