侦听计算属性的更改

时间:2015-09-24 17:04:21

标签: javascript polymer polymer-1.0

非常简单的设置

假设我们有一个计算属性

data: {
 type: Array,
 computed: 'someFunc(someVar)'
}

接下来我们将someFunc定义为

function(someVar){
 return [
  'one string',
  'another string'
 ]
}

并将其作为

包含在DOM中
<template is="dom-repeat" items="{{data}}" as="item">
 <paper-input value="{{item}}">
</template>

问题

我现在如何监听以更改计算属性,我注意到 反映回计算属性,但observer不会被辞退了。我也尝试打开notify: true并听取data-changed事件没有运气并浏览Polymer API我似乎无法找到更直接地听取正确事件的方法(尽管我知道<paper-input>正在发送通知,但是我需要我的听众是通用的,而不是<paper-input>特定的

2 个答案:

答案 0 :(得分:0)

我不知道为什么之前没有用,但我跑了setColor('red')然后注册了一个像

这样的听众
bower update

突然开始工作了,所以我想我遇到了一些最近修复过的bug或问题。

答案 1 :(得分:-1)

这可能会对你有帮助。

 <dom-module id="my-test">
      <template>
        <button on-tap="change">Change someVar value</button>
        <template is="dom-repeat" items="{{data}}" as="item">
           <paper-input value="{{item}}">
        </template>
      </template>

   <script>
    Polymer({
      is: 'my-test',
      properties:{
        someVar:{
          type:Number,
          value:0
        },
        data: {
         type: Array,
         computed: 'someFunc(someVar)',//computed when someVar changes
         observer: "dataChanged"//fired when data changes
        }
      },
      ready: function() {

      },
      dataChanged: function(newValue, oldValue){
        console.log(newValue);//newValue of data
        console.log(oldValue);//old value of data
      },
      change: function(){
        this.someVar = this.someVar+1;
      },
      someFunc:function(someVar){
       return [
        'one string',
        'another string',
        this.someVar
       ]
      },
    });
  </script>
</dom-module>