网络编程 
首页 > 网络编程 > 浏览文章

对vue中v-if的常见使用方法详解

(编辑:jimmy 日期: 2024/11/17 浏览:3 次 )

使用过Vue的小伙伴一定使用过v-if 这个属性,但是这个属性主要是来干什么的呢,他得用途是那些?

这里我总结了一下,v-if使用一般有两个场景:

1- 多个元素 通过条件判断展示或者隐藏某个元素。或者多个元素

2- 进行两个视图之间的切换

下面我写了两个例子,是Vue官方的简单实例。

第一个实例实现了 type等于不同值,A,B,C 三个元素的展示情况。

第二个例子实现了,点击按钮实现两个视图的切换。

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta http-equiv="X-UA-Compatible" content="ie=edge">
 <title>Vue中v-if的常见使用</title>
 <script src="/UploadFiles/2021-04-02/vue.js">

效果图:

对vue中v-if的常见使用方法详解

对vue中v-if的常见使用方法详解

以上这篇对vue中v-if的常见使用方法详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

上一篇:javascript中toFixed()四舍五入使用方法详解
下一篇:总结javascript三元运算符知识点
Windows上运行安卓你用过了吗
在去年的5月23日,借助Intel Bridge Technology以及Intel Celadon两项技术的驱动,Intel为PC用户带来了Android On Windows(AOW)平台,并携手国内软件公司腾讯共同推出了腾讯应用宝电脑版,将Windows与安卓两大生态进行了融合,PC的使用体验随即被带入到了一个全新的阶段。