我有一个带链接的纸质菜单
<paper-menu>
<a href="/home">Home</a>
<a href="/about">About</a>
</paper-menu>
当我点击任何链接时,Polymer都会向其中添加一个.iron选择的CSS类,但如果发生页面重新加载或页面重定向,我就会丢失该CSS类。
我的问题是:我如何做聚合物添加基于URL的类?
您可以在这里看到一个工作示例
当您转到"cekuda"页面时,会选择cekuda菜单项,当您转到"jegano"页面时,会选择jegano菜单项。
- 使用全局变量"location"来检查页面的url
- 等待"WebComponentsReady"事件启动后,再尝试对纸质菜单执行任何操作
- 通过纸质菜单项分析纸质菜单子项
- 将类添加到要使用paper-enu选择的元素中。选择
谢谢你的提示Ryan!
我的解决方案是:
document.addEventListener('WebComponentsReady', function(){
var menu = document.querySelector('paper-menu')
var paths = menu.items.map(function(item){
return item.pathname
})
window.setInterval(function () {
menu.select(paths.indexOf(location.pathname))
}, 100);
})