聚合物计算函数刷新值

Question

嗨，我有与用作绑定到属性的函数的刷新输出相关的问题。

假设我有一部分 html 我想在特定情况下隐藏：

<div hidden$="[[hideElement()]]">

函数被定义为 Polymer 对象：

  hideElement: function () {
      if (this.deviceId == undefined) {
          return false;
      }
      else if (typeof this.deviceId === 'string' || this.deviceId instanceof String) {
          return true;
      }
      else {
          return false;
      }
  },

我看到的是，在此函数的输出发生变化后，该元素并未隐藏。

我可能会错过一些东西，但我不确定是什么。

Answer 1

这在聚合物数据绑定文档中得到了回答。

计算绑定声明包括一个计算函数名称，后跟括号中的依赖项列表。

您的问题是计算函数被调用一次，但由于您没有提供任何参数，因此无法知道将来函数值何时会发生变化。您需要包含一个属性作为依赖项，以便它知道您的函数值何时可能发生变化。

例如：

 <div hidden$="[[hideElement(deviceId)]]"></div>

因此你需要声明一个属性

Polymer({
    is: 'my-element',

    properties: {
        deviceId: String
    },

    hideElement: function(deviceId) {
        return deviceId ? true : false;
    }
})

如果您查看其他聚合物元素，他们通常会调用该函数_isHidden，而不是hideElement指示它将采用 True/False 值。

由于我们已声明deviceId为字符串，这将显着简化您的 hideElement 函数。""、null、 和undefined所有评估为假。