js的if...elseif 怎么用三元表达式写？

Question

{{d.gid ==1 ? 'layui-badge' : 'layui-badge layui-bg-blue'}}

用三元表达式怎么才能写成 if elseif else？

效果要达到下面这样

if(d.gid == 1) {

    'layui-badge'

}elseif(d.gid == 2){

    'layui-badge layui-bg-blue'

}elseif(d.gid == 3){

    'xxxx'

}else{

    'xxx'

}

Answer 1

d.gid === 1 ? 'layui-badge' : d.gid == 2 ? 'layui-badge layui-bg-blue' : d.gid == 3 ? 'xxxx' : 'xxxxx'

Answer 2

是这样：d.gid === 1 ? 'layui-badge' : d.gid == 2 ? 'layui-badge layui-bg-blue' : d.gid == 3 ? 'xxxx' : 'xxx'

Answer 3

短路求值的方式来写逻辑判断并不推荐，毕竟代码主要作用是给人看。最好用switch

Answer 4

如果是 Vue 的话，用个 method 处理一下不比这样写好看多了- -如果不是当我没说……

Answer 5

这种直接用短路写法简洁吧(d.gid == 1 && 'layui-badge')||(d.gid == 2 && 'layui-badge layui-bg-blue')||(d.gid == 3 && 'XXX')||'XXXX'