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

Coffeescript: Add a conditional classname governed by a boolean

本文关键字：控制 布尔值 条件 一个 添加 Coffeescript      更新时间：2023-09-26

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

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

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

此咖啡代码编译为不正确的 JS，如下所示：

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

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

CoffeeScript 没有 C 风格的三元?:，因此：

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

解析为：

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

这是一个存在主义运算符：

存在主义算子

在 JavaScript 中检查变量是否存在有点困难。 if (variable)......接近，但对于零、空字符串和 false，失败。CoffeeScript 的存在主义运算符?返回 true，除非变量为 null 或未定义，这使得它类似于 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 ''}"
相关文章：