..................
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>
)
}
}
devServer: {
port: 3000,
historyApiFallback: true,
hot: true,
proxy: {
'/proxy_auth/*': {
target: 'http://my.backend.domain',
pathRewrite: { '^/proxy_auth': '' },
changeOrigin: true,
cookieDomainRewrite: 'localhost',
withCredentials: true
}
}
},