Question

如何标记基于parsedValue选择的选项？例如。如果parsedValue为0，则应选择值为0的选项。如果parsedValue为1，则应选择值为1的选项？

代码：

parsedValue = 0;

select#myDD.b.pa2.input-reset.ba.bg-transparent.hover-bg-black.hover-white.w-100(type='text', name='myDD')
 option(label='zero', value='0')
  | Space Type
 option(label='first', value='1')
  | Space Type
 option(label='second', value='2')
  | Space Type
 option(label='third', value='3')
  | Space Type

Answer 1

这是使用mixin的好例子：

- var parsedValue = 2

mixin option
  option(selected= (attributes.value == parsedValue))&attributes(attributes)
    if block
      block

select
  +option(label='zero',   value='0') Option 0
  +option(label='first',  value='1') Option 1
  +option(label='second', value='2') Option 2
  +option(label='third',  value='3') Option 3

这是利用implicit attributes argument的无参数混合。调用mixin时提供的任何属性都将反映在呈现的option元素上。

另外，如果selected属性的值与value变量匹配，它将有条件地设置parsedValue属性。

注意：尽管人们期望所选的option用selected="true"渲染，而其他option元素用selected="false"渲染，但Pug是smart enough with boolean attributes清理并使用selected="selected"或完全忽略该属性。

结果HTML：

<select>
  <option label="zero" value="0">Option 0</option>
  <option label="first" value="1">Option 1</option>
  <option selected="selected" label="second" value="2">Option 2</option>
  <option label="third" value="3">Option 3</option>
</select>

JADE节点js标记从值中选择的选项

1 个答案: