javascript - 如何将参数传递给 Polymer 中的函数

Question

我试图调用一个函数并传递一个参数，但它给出了函数未定义的错误。我想这不是传递参数的正确方法。

//it's a big component with many methods

updateData: function(id) {
  console.log(id);
  }

<div class="basic">
  <preview-list class="profileList">
    <template is="dom-repeat" items="{{ followers }}">
      <preview-profile profile$="{{ item }}">
        <div class="connectWrapper">
          <template is="dom-if" if="{_computeIsNotConnected(item.isConnection, item.isConnection2)}}">
            <custom-button on-tap="[[updateData(item.id)]]"></custom-button>
          </template>
        </div>
      </preview-profile>
    </template>
  </preview-list>
</div>

它显示以下错误: 监听器方法 `[[updateData(item.id)]]` 未定义 我也试过用花括号。 如何将参数传递给函数？

Answer 1

您必须使用您的函数名称并从事件参数中获取您的对象:

<template is="dom-repeat" items="{{ data }}">
  <custom-button on-tap="updateData"></custom-button>
</template>

然后像这样定义你的事件处理程序:

updateData: function(event) {
  console.log(event.model.item.id);
}

更新

因为您在 dom-repeat 中使用 dom-if，这是一个错误 (https://github.com/Polymer/polymer/issues/2574)

您可以使用 hidden$="{{_computeIsNotConnected(item.isConnection, item.isConnection2)}}" 而不是 dom-if 模板，

或者改用这段代码:

<template id="repeater" is="dom-repeat" items="{{ data }}">
  <custom-button on-tap="updateData"></custom-button>
</template>

updateData: function(event) {
  console.log(this.$.repeater.modelForElement(event.target));
}