0

       /* Load More Post */	
	   	
        $("div.blog-post").slice(0, 4).show();
          $("#load-more-post").on('click', function (e) {
             e.preventDefault();
             $("div.blog-post:hidden").slice(0, 1).slideDown(300);
             if ($("div.blog-post:hidden").length == 0) {
             $('#post-end-message').html('<div class="end">End</div>').fadeIn(800);
             $("#load-more-post").fadeOut(100);
              }
             });
			 


       /* Load More Portfolio */	
	   	
        $("div.portfolio").slice(0, 2).show();
          $("#load-more-portfolio").on('click', function (e) {
             e.preventDefault();
             $("div.portfolio:hidden").slice(0, 1).slideDown(300);
             if ($("div.portfolio:hidden").length == 0) {
             $('#portfolio-end-message').html('<div class="end">End</div>').fadeIn(800);
             $("#load-more-portfolio").fadeOut(100);
              }
             });

Столкнулся с интересной ситуевиной. React Router при переходе по ссылкам навигации страниц на сайте отображает только часть компонентов на странице перехода. Т.е. если перейти, например, на страницу about она рисуется не полностью, а только часть компонентов. Нет тех компонентов, которые отличают эти страницы ,а только те, которые повторяются, такие как footer, например.

После перезагрузки страницы, она отображается корректно и полностью. Речь идет о работе на локальном сервере. Если перезагрузить ее на хостинге, то страницы вообще не будет, а ошибка 404, но это уже другой вопрос.

В средствах разработчика виден код страницы и в React tool видны недостающие компоненты, но на странице их нет.

Если кто знает как решить эту проблемку, пишите пожалуйста.

class App extends Component {
  render() {
    return (
      <Router>
        <div>
          <Route exact path="/" component={Home} />
          <Route path="/about" component={About} />
          <Route path="/work" component={Work} />
        </div>
      </Router>
    );
  }
}

export default App;

6
  • какая ошибка печатет?
    – Roman C
    30 мая 2018 в 15:47
  • Вы явно делаете что-то не так. В текущем виде на ваш вопрос нельзя дать объективный ответ. Может вы в компонентах чего-то напортачили или еще где-то. Когда идет не полная отрисовка - какие ошибки в консоли, прикрепите в вопрос. 30 мая 2018 в 19:13
  • Спасибо, Роман. Это уже не первое мое приложение на реакте. И раньше не возникало это проблемы. Ошибок нет в консоли, в этом и соль. 31 мая 2018 в 9:57
  • Роман, проблема действительно не в роутере. И вопрос пока закрываю, потому что не видя полной картины подсказать невозможно. 31 мая 2018 в 10:20
  • Нашел в чем проблема, но решения как пофиксить пока нет, позже напишу. Проблема в скрипте, который подгружает динамически контент. Т.е. есть кнопка, которая добавляет на страницу больше контента . И React не подружился с этим скриптом. 1 июн 2018 в 8:37

1 ответ 1

0

Проблема была в скрипте JS, который подгружает динамически контент на страницу, и тем самым, контролировал отображение интерфейса, что реакту и не понравилось.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.