v-bind:属性名='值' 绑定属性的
v-show="" 控制元素的显示和隐藏 使用display:none隐藏
v-if visibility:hidden;
v-else
v-else-if
v-bind.html
浏览器打开
vue引入图片(点击图片可以切换图片)
v-bind练习.html
浏览器打开
点击下面数字切换图片
v-show.html(元素的显示与隐藏)
浏览器打开
点击按钮可以显示或隐藏
v-if与v-show效果相似
都是显示与隐藏元素
v-if使用 visibility:hidden; 隐藏
v-show使用 display:none 隐藏
二者的区别:display:none是彻底消失,不在文档流中占位,浏览器也不会解析该元素;visibility:hidden是视觉上消失了,可以理解为透明度为0的效果,在文档流中占位,浏览器会解析该元素;
网速相同的情况下v-if使用的visibility:hidden; 较快
v-if.html
浏览器打开
按F5刷新可以更换内容