基本概念没什么好讲的。有时候会遇到莫名其妙不显示的问题，这都是因为对这两个概念理解不透彻造成的。

v-show的本质

v-show的本质就是通过调用css的display:none来实现的，这点非常重要，出问题可以在浏览器调试页面手动设置display:none来验证到底v-show有没有生效。

显示隐藏不生效的问题

下面的代码是uview的一个组件，用于显示九宫格。其实就是循环遍历生成很多选项按钮，但是这里的v-show就是没有效果。这时候我手写style="display:none !important"也没有效果。正常情况下应该是有效果的，没效果是这个自定义组件的问题。

        <u-grid:border="false"@click="onClickAgentOptions"col="4"><u-grid-itemv-for="(option,index) in agentPerms":key="index"v-show:option.show>

其实开源框架不会这么low。作者已经提供了custom-style属性：写成下面这样就可以了。parseShow处理返回none或者inline。自定义组件默认display就是inline（这点也非常重要）。
当v-show没效果的时候就需要考虑用display:none来手动实现了。
当v-show没效果的时候就需要考虑用display:none来手动实现了。
当v-show没效果的时候就需要考虑用display:none来手动实现了。

          <u-grid-itemv-for="(option,index) in basicOptions":key="index":custom-style="{display: parseShow(option)}">

点击索引错位问题（v-if）

使用v-if的时候会存在一个非常严重的问题。就是如果通过v-if隐藏列表中的某项，就会导致按钮索引错乱的问题。解决办法就是必须用v-show。而使用v-show会遇到不生效的问题，解决办法就是上小节。