Polymer - 让父元素等待子元素完成执行

Polymer - Make the parent element wait until child element completes execution

我有一个名为 parent-element 的元素和一个名为 name 的 属性。

parent-element 有一个名为 child-element 的子元素。 两者都有双向绑定 属性 称为 name

添加一个代码片段来解释我上面所说的内容

<parent-element>
  <template>
    <child-element name={{name}}> </child-element>
  </template>
 <script>
   properties: {
    name: String
    }
 </script>
</parent-element>

我的问题:

我希望 parent-element 等到 child-element 执行并发回 属性 name(或者)至少 parent-element 必须重新渲染每次 child-elementname 属性.

发送新值后

有没有关于如何做到这一点的例子?

您应该在 child 元素中将 notify 标记为 true,并在 parent 元素中将 name 属性 上添加观察者。这样,只要 child 元素中的 属性 发生变化,您的 parent 就会收到通知。 请注意,您需要执行从 parent 到 child 的 two-way 绑定才能正常工作。 如果您不想 parent 更新 child 的 属性,请标记 child 的 name 属性 作为 readOnly

<script src="https://polygit.org/components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="https://polygit.org/components/polymer/polymer.html">

<dom-module id="child-element">
  <template></template>
</dom-module>
<script>
  Polymer({
    is: 'child-element',
    properties: {
      name: {
        type: String,
        notify: true
      }
    },
    attached: function() {
      this.name = "John";
    }
  });
</script>



<dom-module id="parent-element">
  <template>
    [[name]]
    <child-element name="{{name}}"></child-element>
  </template>
</dom-module>
<script>
  Polymer({
    is: 'parent-element',
    properties: {
      name: {
        type: String,
        value: "James",
        observer: '_nameChanged'
      }
    },
    _nameChanged: function(newVal) {
      console.log("Name is", this.name);
    }
  });
</script>

<parent-element></parent-element>