Где добавлен контейнер в приложении React? - PullRequest
0 голосов
/ 13 июня 2018

Я разветвил это приложение React: https://github.com/react-boilerplate/react-boilerplate

В данный момент я пытаюсь отобразить в приложении простой контейнер с именем «Расписание», контейнер был создан с помощью приложения:

export class Schedule extends React.Component { // eslint-disable-line react/prefer-stateless-function
  render() {
    return (
      <div>
        <Helmet>
          <title>Schedule</title>hoera
          <meta name="description" content="Description of Schedule" />
        </Helmet>
      </div>
    );
  }
}

Теперь я пытаюсь использовать этот контейнер внутри другого контейнера:

import Schedule from 'containers/Schedule';

    <AppWrapper>
                  <Schedule></Schedule>
                  <Helmet
                    titleTemplate="%s - React.js Boilerplate"
                    defaultTitle="React.js Boilerplate"
                  >
                    <meta name="description" content="A React.js Boilerplate application" />
                  </Helmet>
                  <Header />
                  <Switch>
                    <Route exact path="/" component={HomePage} />
                    <Route path="/features" component={FeaturePage} />
                    <Route path="" component={NotFoundPage} />
                    <Route path="/schedule" component={Schedule} />

                  </Switch>
                  <Footer />
    <AppWrapper/>

Проблема в том, что Расписание не отображается.Как я могу отобразить этот контейнер?полный источник: реактор-образец

Ответы [ 2 ]

0 голосов
/ 31 июля 2018

Ваш компонент не отображается, потому что вы ничего не помещаете в него ... Шлем просто меняет заголовок страницы (заголовок и т. Д.).

Попробуйте добавить это:

export class Schedule extends React.Component { // eslint-disable-line react/prefer-stateless-function
  render() {
    return (
      <div>
        <Helmet>
          <title>Schedule</title>hoera
          <meta name="description" content="Description of Schedule" />
        </Helmet>
        <div>Hello World</div>
      </div>
    );
  }
}
0 голосов
/ 13 июня 2018

Разве вы не получаете сообщение об ошибке?Ваш компонент Расписание является именованным экспортом, а не по умолчанию.Поэтому вам нужно импортировать его как:

import { Schedule } from "containers/Schedule";

или не давать ему имя, просто экспортируйте по умолчанию:

export default class extends React.Component {
    ....
}

Также вам не нужно использовать ваштакой компонент: <Schedule></Schedule> Вы не передаете ему дочерний элемент, просто используйте его с закрывающим тегом: <Schedule />

Если этот ответ не решит вашу проблему, нам может потребоваться дополнительная информация.

...