NavigateEvent:info 属性
NavigateEvent
接口的只读属性 info
返回由发起导航操作(例如 Navigation.back()
或 Navigation.navigate()
)传递的 info
数据值,如果未传递 info
数据,则返回 undefined
。
值
由发起导航操作传递的 info
值,如果未传递任何值,则返回 undefined
。
示例
info
的一个使用示例是根据到达某个路由的方式触发不同的单页面导航渲染。例如,考虑一个照片库应用程序,您可以通过不同的路由到达相同的照片 URL 和状态。您可能希望使用不同的动画来显示每个路由的照片。
js
navigation.addEventListener("navigate", (event) => {
if (isPhotoNavigation(event)) {
event.intercept({
async handler() {
switch (event.info?.via) {
case "go-left": {
await animateLeft();
break;
}
case "go-right": {
await animateRight();
break;
}
case "gallery": {
await animateZoomFromThumbnail(event.info.thumbnail);
break;
}
}
// TODO: actually load the photo.
},
});
}
});
规范
规范 |
---|
HTML 标准 # dom-navigateevent-info-dev |
浏览器兼容性
BCD 表格仅在浏览器中加载
另请参阅
- 现代客户端路由:导航 API
- 导航 API 说明
- Domenic Denicola 的 导航 API 直播演示
- 允许传递 info 的方法 -
Navigation.back()
、Navigation.forward()
、Navigation.navigate()
、Navigation.reload()
和Navigation.traverseTo()