vhuk1802
@vhuk1802

Как правильно создать посредника для подгрузки react компонент?

есть код:

import React, {Component} from 'react';
import {Route, Switch} from 'react-router-dom';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import ContentIndex from '../pages/ContentIndex';
import Catalog from '../pages/Catalog';

class Root extends Component {
  
  render(){
      return(
      <div className="all-data">
			<Switch>

				<Route
				exact
				path={"/"}
				component={ContentIndex}
				/>

				<Route
				path={'/catalog'
				component={Catalog}
				/>
              
              </Switch>
       </div>

      )
  }

}


при монтировании каждой компоненты нужно выполнять определенный кусок кода, для этого хочу обернуть каждую страницу в функцию loadableComponent
должно получиться так :
<Route
	exact
	path={"/"}
	component={loadableComponent( ContentIndex )}
	/>

вот сама функция loadableComponent
import React from "react";
import Page from './Page';

const loadableComponent = (Component) => (

	 <Page main={'Component'} />

)

export default loadableComponent;


после того, когда я передал в функцию компоненту ээ нужно прокинуть в шаблон для компонент Page
import React, {Component} from 'react';

export default class Page extends Component {

	constructor(props) {

		super(props);

		console.log('test calculate')

	}

	render() {

		return (<div>{this.props.main}</div>);
	}
}
  • Вопрос задан
  • 64 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы