<nuxt-link :to="link.headKeywords" prefetch class="w_100" :class=" link.i === 3 ? [news_actionIndex === i ? 'nav_action' : ''] : link.i === 1 " > {{ item.productClassifyName || item.jourlismClassifyName || item.headTitle }} </nuxt-link>三元表达式 怎么写多判断的
时间: 2024-02-10 14:15:33 浏览: 118
在三元表达式中可以使用多个条件来进行判断。一般来说,多个条件的三元表达式的写法如下:
```javascript
condition1 ? value1 : (condition2 ? value2 : (condition3 ? value3 : value4))
```
其中,`condition1`、`condition2`、`condition3` 为判断条件,`value1`、`value2`、`value3`、`value4` 为条件满足时对应的返回值。如果第一个条件不满足,则会继续判断第二个条件,如果第二个条件也不满足,则会继续判断第三个条件,以此类推,直到所有条件都判断完毕。
在你提供的代码中,三元表达式中有两个条件,如果需要加入第三个条件,可以将它插入到第二个条件和第三个返回值之间,具体写法如下:
```javascript
link.i === 3 ? (news_actionIndex === i ? 'nav_action' : '') : (link.i === 1 ? 'value2' : 'value3')
```
其中,`link.i === 3` 是第一个条件,如果不满足则进入第二个条件 `link.i === 1`,如果第二个条件也不满足,则返回 `value3`。
相关问题
<nuxt-link :to="link.headKeywords" prefetch class="w_100" :class=" link.i === 3 ? [news_actionIndex === i ? 'nav_action' : ''] : link.i === 3 " > {{ item.productClassifyName || item.jourlismClassifyName || item.headTitle }} </nuxt-link>三元表达式怎么写
三元表达式的写法如下:
```javascript
link.i === 3 ? (news_actionIndex === i ? 'nav_action' : '') : link.i === 3
```
其中 `link.i === 3` 是第一个条件语句,如果满足该条件,就会执行 `news_actionIndex === i ? 'nav_action' : ''`,否则执行 `link.i === 3`。
<nuxt-link :to="link.headKeywords" prefetch class="w_100" :class="[]" > {{ item.productClassifyName || item.jourlismClassifyName || item.headTitle }} </nuxt-link>动态绑定类名 在link.i===1 和===3的时候拥有 'nav_action'的样式
这是一个 Nuxt.js 模板中的代码,其中使用了动态绑定 class 属性的方式来控制样式的应用。在这个模板中,`:class="[]"` 表示该元素初始时不应用任何样式。然后,在 `nuxt-link` 标签上使用了动态绑定 `class` 属性的方式,通过 JavaScript 表达式来判断何时应该应用 `'nav_action'` 样式。具体来说,当 `link.i` 的值为 1 或 3 时,会在 `class` 属性的值中添加 `'nav_action'` 样式,否则不添加。因此,只有在 `link.i` 的值为 1 或 3 时,才会应用 `'nav_action'` 样式。
阅读全文