我在我的rails应用程序中使用聚合物铁页和纸标签.问题是在点击其中一个纸张标签之前没有显示任何页面.我想在没有用户交互的情况下默认选择铁页中的第一页.
我已将两个纸标签和铁页放在< template is ='dom-bind'>< / template>中.已阅读有关数据绑定的文档,但我无法弄清楚如何实现这一点.请有人建议你提出宝贵意见.谢谢.
<template is="dom-bind"> <div class="middle"> <paper-tabs class="bottom self-end" selected="{{selected}}"> <paper-tab>Page 1</paper-tab> <paper-tab>Page 2</paper-tab> </paper-tabs> </div> <div class="bottom"> <iron-pages selected="{{selected}}"> <div> Page 1(This should be selected by default.) </div> <div> Page 2 </div> </iron-pages> </div> </template>
解决方法
由于您正在使用自动绑定模板,只需添加一个简短的脚本来设置< iron-pages>的所选属性.加载时的元素.例如(假设您使用的是webcomponents-lite.js):
<template is="dom-bind"> <div class="middle"> <paper-tabs class="bottom self-end" selected="{{selected}}"> <paper-tab>Page 1</paper-tab> <paper-tab>Page 2</paper-tab> </paper-tabs> </div> <div class="bottom"> <iron-pages selected="{{selected}}"> <div> Page 1 (This will be selected by default.) </div> <div> Page 2 </div> </iron-pages> </div> </template> <script> document.addEventListener('WebComponentsReady',function () { var template = document.querySelector('template[is="dom-bind"]'); template.selected = 0; // selected is an index by default }); </script>
原文地址:https://www.jb51.cc/js/155526.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。