Coffeescript：添加一个由布尔值控制的条件类名

Question

我正在尝试使用此向反应中的元素添加 class 名称：

className: "btn btn-primary #{!@valid() ? 'disabled' : ''}"

但是这会导致 class="btn btn-primary true"

本咖啡代码编译错误的JS如下：

className: "btn btn-primary " + ((ref = !this.valid()) != null ? ref : {
          'disabled': ''
        }),

在咖啡中执行此操作的正确语法是什么？

Answer 1

CoffeeScript 没有 C 风格的 ?: 三元所以这个：

!@valid() ? 'disabled' : ''

解析为：

!@valid() ? ({ 'disabled' : '' })

这是一个 existential operator:

The Existential Operator

It's a little difficult to check for the existence of a variable in JavaScript. if (variable) ... comes close, but fails for zero, the empty string, and false. CoffeeScript's existential operator ? returns true unless a variable is null or undefined, which makes it analogous to Ruby's nil?

结合对象字面量。因此，您看到的 JavaScript 看起来很奇怪。

CoffeeScript 使用 if expressions 而不是 ?::

CoffeeScript can compile if statements into JavaScript expressions, using the ternary operator when possible, and closure wrapping otherwise. There is no explicit ternary statement in CoffeeScript — you simply use a regular if statement on a single line.

如果你在JavaScript中这样说：

!this.valid() ? 'disabled' : ''

然后你会在 CoffeeScript 中这样说：

if !@valid() then 'disabled' else ''

并且由于 "#{...}" 使用表达式：

className: "btn btn-primary #{if @valid() then 'disabled' else ''}"

Coffeescript：添加一个由布尔值控制的条件类名

Coffeescript: Add a conditional classname governed by a boolean

javascript

coffeescript

ruby-on-rails-4

react-rails