如何访问Polymer中父元素或其他元素的属性?
例如,我最顶层的元素是“ my-app”。
现在,我处于名为“ my-element-1”的元素中,如何使用Javascript访问/引用“ my-app”中的任何属性?
此外,如果我位于“ my-element-2”中,是否可以访问/引用“ my-element-1”的属性?
编辑:我为什么要这样做有很多原因,我当然相信有比必须这样做更好的方法。但是,我不知道方法。
1:想到的第一个用例是,我使用位于父元素中的“ iron-pages”。因此,每个“页面”都是该父级的子级。
父母肯定知道哪个“页面”被“选择”,因为“铁页面”是父母的属性。
但是,每个“页面”都不知道是被选择还是不再被选择,因为“被选择”属性仅是父级知道的。
在这种用例中,我只想能够从“页面”中知道是否仍处于选中状态。
2:第二个用例可能是通用设计模式。我想维护一组GLOBAL属性,然后可以在Polymer应用程序中的任何位置进行访问。我的假设是,它应作为根元素存储在“ my-app”中。
最佳答案
1在像iron-pages
这样的封闭的父子对中,您可以利用selectedAttribute和selectedClass属性。通过设置其中之一,您可以让孩子“知道”已被选中。
2另一个例子不是那么简单。为了保持共享状态,您可以使用元素,该元素最近在Polymer的Slack中提到。 oxygen-state
可以使用类似的解决方案,使您可以访问全局变量。iron-meta
是整个应用程序中连接元素的更强大的解决方案。它似乎是解决类似问题的一种方法-页面上元素之间的通信。如果元素要自由通信,那么很快就会变得笨拙。您可以阅读有关SO的许多相关问题:Flux pattern,Flux architecture with polymer elements,Binding to global variables in Polymer
对此的一种简化是使用事件将应用程序中其他位置的更改通知任何感兴趣的元素。天真的方法是监听document
上的事件。然后还有Polymer 1.0: How to pass an event to a child-node element without using <iron-signals>?元素。