Recientemente vi la implementación del modo HTML5 de Vue-Router, y luego estudié la historia de HTML5 por cierto.
1. Historia. PushstateHistory.PushState (estado, título, URL);
Los primeros y el segundo parámetros anteriores pueden estar vacíos, principalmente el tercer parámetro, lo que indica la dirección del nuevo registro histórico. URL actual
2. Historia.History.Replacestate (estado, título, URL);
Window.history.Replacestate es similar a Windows.history.pushstate. agregado al punto de registro.
3. Ventana.Ven y escucha los cambios de la URL
Window.AdDeventListener (PopState, function () {varcrentState = History.state;/** Programa se ejecutará después de activar el evento*/});JavaScript Script ejecuta Window.history.PushState y Windows.history.replacestate no activará el evento OnPopState.
La reacción del navegador Google y el navegador Firefox en la página por primera vez en la página es diferente.
Cuarto, un ejemplo de modo HTML5 similar al Router Vue se publica a continuación. <! style.css> <style type = text/css> .Container-bg {ancho: 1000px; : 30px; <body> <div class = Container-bg> <ul class = Pagination> <li> 1 </li> <li> 2 </li> <li> 3 </ul> </ul> </ul> < /ul> </ul> </ul> </ul> ul class = ptting> </ul> </iv> <script type = text/javascript src = js/jQuery-3.2.1.min.js> < /script> <script type = text/javaScript> Histrem Y.Replacestate (nulo, título de página, http: //127.0.0.0.1: 3000/lmw/0); SearchObject = {};/ *Este objeto se usa para guardar la URL del estado Push como el siguiente. /lmw/0: 0: 0}/var factor = function () {var addvA = document.href; consulta == Undefined? +++++ consultas, function (data) {var data2 = json.parse (data); > '+data2.data [i] .name+' </li> '} $ ('. Ptting '). function () {var query = $ (this) .index (); = 0; , http://127.0.0.1:3000/lmw/+que); : 3000/lmw/+qury] = consulta})})}) // activar el evento PopState si el navegador avanza o se retira. >Por cierto, publique un código de servidor en Node.js.
Var fs = request ('fs') var ruta = solicitudes ('ruta') var express = request = request ('expresion') var app = express (); ); Res.json (text.ToString ())} Catch (err) {res.send ('jaja! ¡Tonto, sin pull!)}) App.use (enrutador) App.listen (3000)Nota: History.PushState ({PageIndex: 1}, http://127.0.0.1:3000/lmw/+query) El tercer parámetro aquí escribe una ruta absoluta completa, si se escribe como relativa, la ruta se agregará con la URL ilimitada como consulta, porque la ruta relativa debe ser la URL actual
El servidor se coloca con data0.json, data1.json, data2.json para simular la base de datos para obtener datos. y luego enviar al frente
El anterior es el modo de historia en el HTML5 introducido por Xiaobian. ¡Muchas gracias por su apoyo al sitio web de VEVB Wulin!