单页web应用（spa）内部路由原理

（用户只需要加载一次页面就可以不再请求，当点击其他子页面时只有相应url改变而不会重新加载）

可以将路由的实现分为两部分

1.更新URL页面不刷新

2.监听URL的变化，执行页面替换逻辑

两种实现方法

1.history.pushState，replaceState等触发popState事件

https://blog.csdn.net/cvper/article/details/79477116

2.location.hash的变化触发hashchange事件

function getUUID () {
  return Math.floor(Math.random() * 1000000)
}
window.onload = function () {
  const el = document.getElementById('toggle')
  el.onclick = (e) => {
    e.preventDefault()
    const uuid = getUUID()
    location.hash = '#' + uuid
  }
  window.onhashchange = (e) => {
    console.log('oldURL:', e.oldURL)
    console.log('newURL:', e.newURL)
  }
}