js采用三目运算嵌套层数过多怎么优化

  • Post author:
  • Post category:其他


css采用三木运算嵌套层数过多,优化方案

 <text :style="item.importance == 4 ? {color: '#fa3534'} : (item.importance == 3 ? {color: '#ff9900'} : (item.importance == 2 ? {color: '#D061FF'} : {color: '#000000'}))">
    标题
 </text>

当三目运算套了多层以后,可读性就没这么清晰了,这个时候采用对象的

key-value

就清晰很多了


修改====》

//修改后
 <text :style="{
				4:{color: '#fa3534'},
				3:{color: '#ff9900'},
				2:{color: '#D061FF'}
	         }[item.importance]|| {color: '#000000'}">标题
</text>



版权声明:本文为weixin_39818813原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。