Polymer-Fire不更新UI复选框

时间:2018-11-14 02:35:10

标签: polymer

我的设置非常简单。当我选中复选框时,将打开一个弹出窗口,要求链接到另一个复选框。

当我关闭弹出窗口时,无论我选择了哪个复选框,都将被选中。

我已经用复选框值更新了数组。

关闭弹出窗口后,值将直接显示在数组中,而不显示在UI中。当我选择其他标签并返回该标签时,复选框显示为正确。

this.fire('details', this.details);

这在子页面上不起作用。

如何刷新父元素?

1 个答案:

答案 0 :(得分:0)

在您的details事件上方,将在父元素上以on-<your-custom-event>的一个事件on-details触发一个事件,因此您需要像在父元素上分配一个监听器:

<child-element
     on-details = '_detailsChanged'>
</child-element>
...
Polymer {(

    _detailsChanged: function(e) {
        // e.detail will give you this.details object
      }

或者我假设您想在子对象上分配一个对象并在父对象上反映观察结果,所以在父元素上:

<child-element
    details = "{{details}}"
><child-element>

在子元素上,您需要在属性声明中notify=true并通过在父对象上进行可观察到的更改来通知路径,例如:

properties: {
      details: {
          type:Object,
          notify:true
      }
    }
..

this.set('details', nevDetailsValue);  //Use this.set method 
this.notifyPath('details');  // Than detail property will change value at parent.

编辑:需要指定确切的路径!

DEMO

 this.notifyPath('details.<path which is changed>'); // ie:this.notifyPath('details.name')