v-show
1、作用：控制元素显示隐藏
2、语法：v-show="表达式“ 表达式值true显示，false隐藏
3、原理：切换disply:none控制显示隐藏
4、场景：频繁切换显示隐藏的场景
例如：
v-if
1、作用：控制元素显示隐藏（条件渲染）
2、语法：v-if="表达式“ 表达式值true显示，false隐藏
3、原理：基于条件判断，是否创建或移除元素节点
4、场景：要么显示，要么隐藏，不频繁切换的场景
例如：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="vue.js" ></script> </head> <body> <div id="app"> <div v-show="flag" clss="box">我是v-show</div> <div v-if="flag" clss="box">我是v-if</div> </div> <script> const app=new Vue({ el:"#app", data:{ flag:true } }) </script> </body> </html>
true:显示结果
false:隐藏结果
3208
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
