聚合物 - 如何覆盖计算的属性?

问题描述:

如何覆盖计算的属性?聚合物 - 如何覆盖计算的属性?

这里有一个片段,其中的父类A计算result属性等于value财产,而它的子类B重新计算result属性等于value + value2

但覆盖不工作...

class A extends Polymer.Element {  
 
    static get properties(){ 
 
     return { 
 
     value : Number, 
 
     
 
     result : { 
 
      type : Number, 
 
      computed : "computeProperty(value)" 
 
     } 
 
     } 
 
    } 
 
    
 
    computeProperty(value){ 
 
     return value; 
 
    } 
 
    } 
 
    
 
    class B extends A { 
 
    static get is() { return "b-element"; } 
 
    
 
    static get template(){ 
 
     return ` 
 
     <div>Value : [[value]]</div> 
 
     <div>Value2 : [[value2]]</div> 
 
     <div>Result : [[result]]</div> 
 
     ` 
 
    } 
 
    
 
    static get properties(){ 
 
     return { 
 
     value2 : Number, 
 
     
 
     result : { 
 
      type : Number, 
 
      computed : "recomputeProperty(value, value2)" 
 
     } 
 
     } 
 
    } 
 
    
 
    recomputeProperty(value, value2){ 
 
     return value + value2; 
 
    } 
 
    } 
 
    
 
    
 
    // Register the new element with the browser 
 
    customElements.define(B.is, B);
<script src="https://polygit.org/components/webcomponentsjs/webcomponents-loader.js"></script> 
 
<link rel="import" href="https://polygit.org/components/polymer/polymer-element.html"> 
 

 
    <b-element value="1" value2="2"> 
 
    </b-element>

我不认为这是可能的,但你可以做的是利用观察员:

static get properties() { 
     return { 
     // ... 

     result : { 
      type : Number, 
      // making the result read-only because it's computed 
      readOnly : true, 
     } 
     } 
    } 


    static get observers() { 
     return ['onValueChanged(value, value2)'] 
    } 

    onValueChanged(value, value2) { 
     this.setProperties({ 
     result : value + value2 
     }, true); 
    } 
+0

**这真的是个坏主意**,因为** [计算函数的参数是函数的依赖关系](https://www.polymer-project.org/2.0/docs/devguide/ob服务器#限定-A计算的属性)**。这意味着,当作为函数的参数放置的其中一个属性发生更改时,这将直接触发计算函数以重新计算计算出的属性。 在你的情况下,'result'属性是静态的,并且如果'value'或'value2'改变,将永远不会重新计算。 – Yairopro

+0

这是真的,但我认为你不能让它表现得那样。你可以做的是创建一个观察者,观察这两个值并相应地更新结果。我更新了答案。 – Elar

+0

这个答案好多了!但仍然不是我正在寻找的东西。因为在我无法编辑父类的代码并重新实现计算其属性的方式(使用lcomplex-listener而不是计算属性)的情况下,这不是一个解决方案。 – Yairopro