Как заставить DOM работать с изменением и загрузкой представления SPA? - PullRequest
Новая
       2

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

0 голосов
/ 22 апреля 2020

В настоящее время я работаю над одностраничным приложением (после этого урока ) и столкнулся с двумя препятствиями.

  1. При изменении представления SPA я пытаюсь выполнять функции и манипулировать некоторыми элементами (CSS, Text et c.), Когда ha sh изменяется и местоположение ha sh равно названным именам. Проблема : элементы не меняются должным образом. Это похоже на проблему с загрузкой видов, потому что я смог внести изменения во все тело, например, изменить цвет фона. Но не к представлениям, которые маршрутизатор загружает в div с приложением id.

  2. Решено . Как функция, она не выполняется при перезагрузке приложения. 

    window.addEventListener('hashchange', function(e){
if(location.hash=='#profile')
{
  console.log('#profile');
}
else if(location.hash=='#cvedit')
{
  console.log('#cvedit');    
}
else if(location.hash=='#poll')
{
  console.log('#poll');
  $("#question_text").css("color","blue");
  $("#question_text").text("Where's Waldo?");
}
else if(location.hash=='#about')
{
  console.log('#about');

}
else if(location.hash='#home')
{
  console.log('#home');
}})

1 Ответ

1 голос
/ 22 апреля 2020

Когда вы перезагружаете страницу, браузер не запускает событие hashchange ( MDN ), поэтому ваш код работает не так, как предполагалось. Вы можете использовать DOMContentLoaded событие, чтобы поймать перезагрузки. 

window.addEventListener('hashchange', yourCallbackFunction)
window.addEventListener('DOMContentLoaded', yourCallbackFunction)
...