vue中if和show不能同时用

vue中的v-show和v-if是做什么用的，两者区别是什么

v-if和v-show可以一起使用，方法如下：

在开发项目过程中v-if和v-show一起使用时，接下面跟着的v-else会在页面上面显示两次 。代码如下：

<tbody class="sortable" id="sortTable">。

     <tr v-show="items.length" v-for="(item,index) in items" :item="item">。

            <td :id="item.objectId">{{index+1}}</td>。

            <td>{{item.number}}</td>。

     </tr>。

     <tr v-else>。

             <td colspan='2'>暂无数据</td>。

    </tr></tbody>。

原因其实很简单，根据vue的文档描述：

当它们都处于同一节点时，v-for 的优先级高于 v-if。这意味着，v-if 将分别在循环中的每次迭代上运行。

也就是v-if会判断两次。

当然这样用也有它的好处，当你只想将某些项渲染为节点时，这会非常有用，如下：(以上只渲染 todos 中未完成的项。)。

1.v-show跟v-if都是做条件隐藏跟显示用的，

2.v-show是页面加载的时候显示的内容跟隐藏的内容同时加载在页面上只是根据条件进行了隐藏。

3.v-if是页面加载的时候根据条件进行显示需要展示的内容。并且销毁不需要显示的条件内容，每次加载的时候进行销毁当前加载符合条件的内容。

4.简单的来说就是前者在页面上可以看见隐藏的条件，后者看不见隐藏的条件。

5.使用场景：v-show在高频切换的时候为了不浪费资源更多的使用，后者在不需要高频切换的时候更多的使用。

原文地址：http://www.qianchusai.com/vue%E4%B8%ADif%E5%92%8Cshow%E4%B8%8D%E8%83%BD%E5%90%8C%E6%97%B6%E7%94%A8.html