Polymer core-animated-pages默认页面

Question

我正在使用Polymer core-animated-pages在我的网站主页之间切换.

我选择需要通过id显示哪个页面<section>.您可以在此处查看示例.现在,我遇到的问题是,在加载页面时,应该从页面加载应该选择的页面,例如www.example.com/home显示主页,www.example.com/activities显示活动页面(代码中遗漏的代码,因为不相关).

但是,如果链接中提供的ID不存在,我该怎么办？是否有选项显示core-animated-pages带有404消息的默认页面？或者我是否必须检查每个链接是否在我的所有页面的数组中,如果是这样,手动加载错误页面,否则显示正确的页面？

再次,这是一个例子:jsbin.

编辑:要显示我的页面处理链接的方式,这是一个更新示例:jsbin.链接本质上是www.example.com/#home等等

Answer 1

您可以在这里做几件事。

在最简单的情况下，您只需验证 pageChanged 处理程序中的值即可。如果该页面不存在，请更新它：

pageChanged: function(){ var foundPage = this.$.pages.querySelector('#' + this.page); if (! foundPage) { this.page = 'error' } ...

请参阅： http: //jsbin.com/xequvone/14/edit

如果您不core-menu直接将 绑定到core-animated-pages，则可以添加您想要的任何逻辑。以下版本与前一个版本执行完全相同的操作，但对所选页面使用单独的变量：

http://jsbin.com/xequvone/12/edit

我认为如果您的 URL 方案更复杂，您会需要一个路由器。例如，如果哈希包含多个级别和参数，例如#people、#/people/search或#/people/edit/12343。