-
代码演示
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>v-if v-show</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <script type="text/javascript" src="../asserts/js/vue.js"></script> </head> <body> <h1>v-if v-show</h1> <hr> <div id="app"> <div v-show="isShow">v-show</div> <div v-if='isLogin' v-show='isLogin'> Hello GOld</div> <div v-else>请登录</div> </div> <script type="text/javascript"> var app = new Vue({ el:'#app', data:{ isLogin:true, isShow:false } }) </script> </body> </html> -
v-if & v-show的区别：
- v-if ：判断是否加载
- v-show：调整css display属性
学习链接： 技术胖
