0

我正在尝试使用以下方法将类名添加到反应中的元素：

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

然而，这导致class="btn btn-primary true"

这段coffee代码编译成不正确的JS如下：

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

在咖啡中这样做的正确语法是什么？

4

1 回答 1

2

CoffeeScript 没有 C 风格的?:三元组，所以：

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

被解析为：

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

这是一个存在运算符：

存在算子

在 JavaScript 中检查变量是否存在有点困难。if (variable)... 接近，但因零、空字符串和错误而失败。CoffeeScript 的存在运算符?返回 true ，除非变量为null或undefined，这使得它类似于 Ruby 的nil?

与对象文字相结合。因此，您会看到奇怪的 JavaScript。

CoffeeScript 使用if表达式而不是?:：

CoffeeScript 可以将if语句编译成 JavaScript 表达式，尽可能使用三元运算符，否则使用闭包包装。CoffeeScript 中没有明确的三元语句——您只需在一行中使用常规的if语句。

如果你在 JavaScript 中这样说：

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

那么你会在 CoffeeScript 中这样说：

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

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

className: "btn btn-primary #{if @valid() then 'disabled' else ''}"
于 2016-03-19T18:23:28.800 回答