条件成立时渲染某一个dom

众所周知，下面这行代码是当activeName===‘qrcode’的时候才会去创建这个div

<div v-if="activeName==='qrcode'" class="qrcode-box"></div>

在平时的项目中，我们可能会遇到需要一个多字段满足多种状态中的一种时去显示某一个dom

比如当支付状态为已完成或者已取消状态的时候给用户显示取消按钮

于是我们可以这样写：

<a v-if="order.orderState===5&&order.orderState===6">删除</a>

但是如果有更多的状态，需要去控制很多的状态都显示同一个dom节点。这样我们就要一值用&&（或）运算符在后面拼接，会导致我们的代码非常长，甚不美观。

所以我们可以这样写，代码如下：

  <a v-if="[5,6].includes(order.orderState)">删除</a>

这里是数组的includes方法，我们把当前的状态传给数组，如果数据可以在数组里面找到，就会返回true，进而去创建对应的dom节点，反之则会返回false，就不会创建此dom。他可以有效的解决当多状态是或的形式去创建同一个dom所导致的代码段过长的情况。

感觉有帮助的小伙伴可以三连支持一下。