v-show v-if
v-show 和 v-if 的值都是布尔值,true或false,
不同的是
v-show 是采用css的 display:none;和 display:block;来实现显示和隐藏元素的
v-if 是直接把元素移除掉或者添加到页面上的
<!-- v-show v-if --> <!-- v-show 使用display:none;隐藏元素 v-if 直接移除页面元素 它们的值都是布尔值 true false --> <div id="app"> <p class="error" v-show="!msg">错误信息</p> <textarea name="" id="" cols="30" rows="10" v-model="msg"></textarea> <p><button v-show="msg">submit</button></p> <p>{{$data | json}}</p> </div> <script> new Vue({ el:"#app", data:{ msg:'' } }) </script>
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步