vue中的history模式其实就是html5中的history对象。我们可以在控制台打印这个对象,可以看到熟悉的backforwardgopushStatereplaceState等方法。历史上,我们每次pushState时,都会以栈的形式存储一个url数据。我们都知道栈的特点是先进先出。明白了这一点,再去理解history的一些方法调用就会更加直观。pushState的理解pushState(state,title,url)1.state是一个js对象,主要存储一些离职记录的信息。不通过则默认为空。2.title是网页的标题。不通过则默认为空。3.url为新添加的地址。history.pushState('','','home')history.pushState('','','about')history.pushState('','','index')history.pushState('','','main')//栈中的存储顺序是home关于索引从下到上。mainhistory.go(-1)和history.back()是等价的,会弹出栈。history.go(-2)会弹出主索引,所以执行结果如下图currentpathislocalhost:8080/mainhistory.replaceState('','','mypage')当前路径变为localhost:8080/mypage替换掉之前的主路径,相当于从栈中删除最后的摘要:forward(),back(),go(),pushState,replaceState等一系列的操作。出栈和入栈的过程掌握了原理之后其实也很容易理解。今天就分享到这里。不足之处希望大家批评指正。
