Vue中v-if和v-show的区别

v-if:根据条件判断，控制当前的节点是否显示到页面中
如果为true，文本显示

    <div id="a">
        <span v-if='Show'>this is a text</span>
    </div>
    <script>
        new Vue({
            el:'#a',
            data:{
                Show:true
            }
        })
    </script>

如果为false，不会显示，并且节点不会挂载到当前的dom树中；

v-show:和v-if一样根据条件判断，控制当前的节点是否显示到页面中
如果为true，文本显示，
如果为false，它也不会显示，但是节点被挂载到了dom树上，只是加了display: none属性。

<div id="a">
        <span v-show='Show'>this is a text</span>
    </div>
    <script>
        new Vue({
            el:'#a',
            data:{
                Show:false
            }
        })
    </script>