shadowRoot何时可用于聚合物组件？
用户名
我无法理解何时可以访问组件的shadowRoot。这是一组嵌套组件的图像：
因此，有一些组件：
- MortgageDetails：组件将一组3个其他组件绑定在一起
- MoneyInput-带金额标签的输入组件
- NumWithUnitsInput-具有术语标签的输入组件
- RateInput-带Rate标签的输入组件
- PaymentSchedule：带有相应标签的组件
- DateInput：具有开始日期标签的组件
我已经用打印出shadowRoot（sr => ...）的日志消息对创建和附加的方法进行了检测，然后得到以下结果：
mortgageDetails [FINE]: MortgageDetails created sr => null (:1)
moneyInput [FINE]: MoneyInput created sr => null (:1)
numWithUnitsInput [FINE]: NumWithUnitsInput created sr => null (:1)
rateInput [FINE]: RateInput created sr => null (:1)
paymentSchedule [FINE]: PaymentSchedule created sr => null (:1)
dateInput [FINE]: DateInput created sr => null (:1)
mortgageDetails [FINE]: MortgageDetails attached with sr => Instance of 'ShadowRoot' (:1)
日志记录很有意义。组件以合理的顺序创建，然后开始连接。问题是，抵押详细信息在其包含的moneyInput被附加之前被附加。如果在MortgageDetails.attached中再添加一条日志语句，则可以看到其包含的MoneyInput对象具有shadowRoot：
mortgageDetails [FINE]: Composed moneyInput sr => Instance of 'ShadowRoot' (:1)
这是我做事方式的问题。我需要在MoneyInput组件中进行一些初始化事件，以进入shadowRoot并附加一些处理程序。我不能使用created，因为shadowRoot尚未设置。我正在尝试使用attach。我现在在MoneyInput的附件中有这样的代码：
_amountElement = shadowRoot.querySelector('#money-amount')
..onBlur.listen((evt) => reformatAmount())
..onFocus.listen((evt) => reformatAmount())
..onKeyUp.listen((evt) { if(evt.which == 13) reformatAmount(); });
由于已附加MortgageDetails而尚未附加MoneyInput，因此MortgageDetails实例无法使用所包含的MoneyInput，因为它尚未完全初始化。例如，在MortgageDetails激活中，我有：
(mortgageAmountInput = $["mortgage-amount"] as MoneyInput)
..label = r" $ Amount of Loan"
..onBlur.listen((_) => recalc())
..onFocus.listen((_) => recalc());
由于未调用MoneyInput的激活，因此失败。我认为我真正需要的是一个已设置shadowRoot的事件，然后可以对该事件进行初始化。
在聚合物元素的生命周期中我缺少什么？
贾斯汀·法格纳尼（Justin Fagnani）
通常情况下，如果你扩展PolymerElement的主要回调的订货会ready，created，attached。这些是自上而下发生的：它们在后代之前先于祖先被调用。首先ready调用它可能会造成混淆，但这是因为PolymerElement.created在设置DOM甚至处理程序之后调用它，并且是因为在类created构造函数之前发生了构造函数排序。
Polymer还添加了一个domReady可以重写的方法，当确保已创建元素的子元素时将调用该方法。那可能就是您所需要的。
有关生命周期方法的详细信息，请参见http://www.polymer-project.org/docs/polymer/polymer.html#lifecycle方法。
首先，我将看看是否可以通过数据绑定和声明性事件来避免排序问题。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
聚合物-组件布局
- 2
聚合物：何时使用异步？
- 3
聚合物：确定何时加载属性？
- 4
聚合物组件不封装JavaScript
- 5
样式聚合物Web组件
- 6
聚合物 2：组件不呈现
- 7
用于聚合物1.0实例的WebSite？
- 8
何时使用带有聚合物的点击或点击？
- 9
聚合物指针
- 10
聚合物路线
- 11
聚合物表达
- 12
Laravel +聚合物
- 13
聚合物安装
- 14
聚合物会构建更多的现成组件吗？
- 15
如何从飞镖聚合物组件中引用图像
- 16
聚合物Web组件属性值未传递
- 17
反射聚合物/纤维网组件界面
- 18
聚合物组件POST功能的错误请求错误
- 19
是否可以为聚合物组件实施Webpack HMR？
- 20
如何从飞镖聚合物组件中引用图像
- 21
反射聚合物/纤维网组件界面
- 22
聚合物组件POST功能的错误请求错误
- 23
嵌套组件之间的聚合物1.0事件触发
- 24
计算绑定不适用于单击（聚合物）
- 25
可扩展的设置，用于设置聚合物元素的样式
- 26
聚合物+流星，在大火的#each循环中，无法将对象传递到聚合物Web组件
- 27
聚合物的约曼聚合物0.8
- 28
飞镖聚合物更新聚合物dom元素
- 29
聚合物-在聚合物元素内部显示元素
我来说两句