This v-if should be moved to the wrapper element vue/no-use-v-if-with-v-for

这个警告是由Vue.js的lint规则之一发出的，它告诉你在同一个元素上同时使用`v-for`和`v-if`可能会导致一些意想不到的结果，因为`v-for`比`v-if`具有更高的优先级。

解决这个问题的方法是将`v-if`指令放在包装元素上，而不是与`v-for`指令一起使用。例如：

<div v-if="condition">
  <div v-for="item in items">
    {{ item }}
  </div>
</div>

应该重写为：

<div v-if="condition">
  <div v-for="item in items">
    {{ item }}
  </div>
</div>
<div v-else>
  No items to display
</div>

这样可以确保`v-if`指令优先于`v-for`指令执行，并且可以更好地控制条件渲染的行为。