HTML5定义了用于操作历史记录的新API,允许您在不重新加载窗口的情况下更改位置.有一篇关于Dive Into HTML5的精彩文章,展示了如何使用历史API在单页面应用中模拟多页面导航.它很容易翻译成Dart.
在带导航的单页应用程序中,我通常设置客户端代码的方式类似于在服务器上设置RoR或Django应用程序或Dart http服务器的方式：
>定义一组适用于窗口位置的匹配器
>将匹配器映射到显示虚拟页面或其他位置的函数
然后使其成为无缝体验：
>为所有锚点添加一个用于书签的href,但添加一个onclick处理程序来调用一个推送历史状态的函数,并使用preventDefault来防止重新加载.
>在初始页面加载时,读取URL并将其发送到(2)中的地图
样品：
main() {
// handle the back button
window.on.popState.add((_) => showPage());
}
showPage() {
String path = window.location.pathname;
if (path == '/') {
showFrontPage();
} else if (DETAIL_PAGE_URL.hasMatch(path)) {
String id = DETAIL_PAGE_URL.firstMatch(path).group(1);
showDetailPage(i);
}
}
showFrontPage() {
//... code to build a link to a detail page
detailAnchor.on.click.add((MouseEvent e) {
window.history.pushState(null,detail.title,detail.url);
e.preventDefault();
showDetailPage(detail);
},false);
}
如果觉得《html5 保存 搜索历史 html5 – 如何有效处理Dart中的浏览器历史记录(即后退按钮)？...》对你有帮助，请点赞、收藏，并留下你的观点哦！
