Skip to content
On this page

条件语句

条件语句为原本静态的语言提供了控制流,实现条件导入、混合器、函数等功能。下面的例子仅作示例,并不推荐 😃

if / else if / else

if 条件语句的工作方式正如你所期望的,只需接受一个表达式,当表达式为 true 时执行后续代码块。与 if 一起的还有典型的 else ifelse 标记,作为备选方案。

下面的例子将有条件地重载 padding 属性,将其替换为 margin

stylus
overload-padding = true

if overload-padding
  padding(y, x)
    margin y x

body
  padding 5px 10px
overload-padding = true

if overload-padding
  padding(y, x)
    margin y x

body
  padding 5px 10px

另一个例子:

stylus
box(x, y, margin = false)
  padding y x
  if margin
    margin y x

body
  box(5px, 10px, true)
box(x, y, margin = false)
  padding y x
  if margin
    margin y x

body
  box(5px, 10px, true)

另一个 box() 辅助函数:

stylus
box(x, y, margin-only = false)
  if margin-only
    margin y x
  else
    padding y x
box(x, y, margin-only = false)
  if margin-only
    margin y x
  else
    padding y x

unless

对于熟悉 Ruby 编程语言的用户,我们提供了 unless 条件语句。它基本上是 if 的反面——本质上是 if (!(expr))

在下面的例子中,如果 disable-padding-overrideundefinedfalsepadding 将被重载,显示 margin 代替。但如果它是 truepadding 将继续输出预期的 padding 5px 10px

stylus
disable-padding-override = true

unless disable-padding-override is defined and disable-padding-override
  padding(x, y)
    margin y x

body
  padding 5px 10px
disable-padding-override = true

unless disable-padding-override is defined and disable-padding-override
  padding(x, y)
    margin y x

body
  padding 5px 10px

后缀条件

Stylus 支持后缀条件。这意味着 ifunless 作为运算符;当右侧表达式为真时,它们会评估左侧操作数。

例如,让我们定义 negative() 来执行一些基本的类型检查。下面我们使用块风格的条件:

stylus
negative(n)
  unless n is a 'unit'
    error('invalid number')
  if n < 0
    yes
  else
    no
negative(n)
  unless n is a 'unit'
    error('invalid number')
  if n < 0
    yes
  else
    no

接下来,我们利用后缀条件使我们的函数更简洁。

stylus
negative(n)
  error('invalid number') unless n is a 'unit'
  return yes if n < 0
  no
negative(n)
  error('invalid number') unless n is a 'unit'
  return yes if n < 0
  no

当然,我们可以更进一步。例如,我们可以写 n < 0 ? yes : no,或者简单地使用布尔值:n < 0

后缀条件可以应用于大多数单行语句。例如,@import@charset、混合器——当然,还有下面所示的属性:

stylus
pad(types = margin padding, n = 5px)
  padding unit(n, px) if padding in types
  margin unit(n, px) if margin in types

body
  pad()

body
  pad(margin)

body
  apply-mixins = true
  pad(padding, 10) if apply-mixins
pad(types = margin padding, n = 5px)
  padding unit(n, px) if padding in types
  margin unit(n, px) if margin in types

body
  pad()

body
  pad(margin)

body
  apply-mixins = true
  pad(padding, 10) if apply-mixins

生成:

css
body {
  padding: 5px;
  margin: 5px;
}
body {
  margin: 5px;
}
body {
  padding: 10px;
}
body {
  padding: 5px;
  margin: 5px;
}
body {
  margin: 5px;
}
body {
  padding: 10px;
}

Released under the MIT License.