1

我试图将for循环变量作为参数传递给coffeescript中的onclick方法，如下所示：

for index, option_value of @state.option_values
                  dom.span
                    key: "#{index} #{option_value.name}"
                    className: "pull-left col-md-3#{if option_value.selected then ' selected' else ''}"
                    onClick: () => @selectThis option_value


selectThis: (option_value_selected) ->
    alert(option_value_selected.name)

但option_value总是指 in 的最后一个option_value值@state.option_values。我知道如何用普通的 javascript 解决这个问题。但是，如何在咖啡中解决这个问题？

4

2 回答 2

2

问题是你的功能：

onClick: () => @selectThis option_value

is 只是存储option_value直到稍后调用处理程序时才会评估的引用onClick。

这是 JavaScript 和 CoffeeScript 中循环的一个非常常见的问题，解决方案始终相同：在创建匿名函数时强制计算变量。您的：

@selectThis.bind(null, option_value)

通过调用Function.prototype.bind函数来做到这一点（但@会在调用函数null时进行，所以要小心）。

JavaScript 中的一个常见习惯用法是将循环体变成一个自调用函数：

for(i = 0; i < 6; ++i)
    (function(i) { ... })(i)

强制在每次迭代时评估循环变量。CoffeeScript 有do循环作为这个习语的快捷方式：

当使用 JavaScript 循环生成函数时，通常会插入一个闭包包装器，以确保循环变量是封闭的，并且所有生成的函数不只是共享最终值。CoffeeScript 提供了do关键字，它立即调用传递的函数，转发任何参数。

一个惯用的 CoffeeScript 解决方案如下所示：

for index, option_value of @state.option_values
  do (index, option_value) =>
    dom.span
      key: "#{index} #{option_value.name}"
      className: "pull-left col-md-3#{if option_value.selected then ' selected' else ''}"
      onClick: => @selectThis option_value
于 2016-05-13T17:12:50.693 回答
1

终于找到正确的语法了，sigh：

onClick: @selectThis.bind(null, option_value)
于 2016-05-13T15:57:12.383 回答