Почему для вычисляемых свойств Polymer нужны явные аргументы свойств?

Question

Я немного искал элементы Polymer 1.0, и мне немного любопытно узнать о вычисленных свойствах.

Например, в бумаге-ящик-panel.html,

<dom-module id="paper-drawer-panel" …> 
    … 
    <div id="main" style$="[[_computeDrawerStyle(drawerWidth)]]"> 
    … 
    </div> 
    … 
</dom-module> 
<script> 
Polymer({ 
    is: 'paper-drawer-panel', 
    … 
    _computeDrawerStyle: function(drawerWidth) { 
    return 'width:' + drawerWidth + ';'; 
    }, 
    … 
</script> 

drawerWidth является свойством paper-drawer-panel, так почему это так важно, чтобы явно включить его в параметрах вычисленного свойства?

Является

[[_computeDrawerStyle()]] 

… 

_computeDrawerStyle: function() { 
    return 'width:' + this.drawerWidth + ';'; 
} 

Это плохая практика?

Answer 1

Явные аргументы в вычисленных привязках служат важной цели: указание Полимера, свойства которого зависят от вычисленного связывания. Это позволяет Polymer знать, когда пересчитывать и обновлять вычисленное привязку.

Возьмите [[_computeDrawerStyle()]], например. В этом случае Polymer не имеет представления о том, на каких других свойствах рассчитывается вычисленное связывание, и будет вычислять только один раз при загрузке.

Как только вы добавите drawerWidth явно ([[_computeDrawerStyle(drawerWidth)]]) Полимер теперь знает, что он должен работать вычисленная связывание снова новое значение каждый раз, когда drawerWidth изменения.

Answer 2

Я думаю, вы в замешательстве. Что вы здесь делаете в примере кода здесь style$="[[_computeDrawerStyle(drawerWidth)]]" - это вызов частной функции, называемой _computeDrawerStyle, и, конечно же, вам нужно явно указать ей правильные параметры. Ознакомьтесь с документацией here, чтобы узнать о вычисленных свойствах.

Answer 3

Полимер имеет две отдельные концепции, и вы их сбиваете с толку.

1. Вычисленная недвижимость. Это свойства, которые зависят от других и пересчитываются всякий раз, когда их компоненты изменяются. Затем вы можете привязать значение этого рассчитанного свойства как значение свойства. <paper-draw-panel> НЕ имеет вычисленного свойства (я проверил код).

2. Функциональные вызовы, на которые делается ссылка в привязке данных (что является то, что _computeDrawStyle). Это приводит к тому, что Polymer вызывает эту функцию (элемента), когда когда-либо изменятся ее параметры. Параметры - это все свойства (или вы можете использовать подварианты объектов и индексы массивов). Это то, что происходит здесь.