<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當前位置: 首頁 - 科技 - 知識百科 - 正文

        對vue中v-if的常見使用方法詳解

        來源:懂視網 責編:小采 時間:2020-11-27 22:06:54
        文檔

        對vue中v-if的常見使用方法詳解

        對vue中v-if的常見使用方法詳解:使用過Vue的小伙伴一定使用過v-if 這個屬性,但是這個屬性主要是來干什么的呢,他得用途是那些? 這里我總結了一下,v-if使用一般有兩個場景: 1- 多個元素 通過條件判斷展示或者隱藏某個元素?;蛘叨鄠€元素 2- 進行兩個視圖之間的切換 下面我寫了兩個例子,
        推薦度:
        導讀對vue中v-if的常見使用方法詳解:使用過Vue的小伙伴一定使用過v-if 這個屬性,但是這個屬性主要是來干什么的呢,他得用途是那些? 這里我總結了一下,v-if使用一般有兩個場景: 1- 多個元素 通過條件判斷展示或者隱藏某個元素?;蛘叨鄠€元素 2- 進行兩個視圖之間的切換 下面我寫了兩個例子,

        使用過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="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.js"></script>
        </head>
        <script>
        window.onload = function(){
        
         //創建一個vue實例
         var app = new Vue({
         el: '#app',
         data: {
         type:'C',
         loginType:'username'
         },
         methods:{
         changeloginType(){
         let self = this;
         if(self.loginType=='username'){
         self.loginType = ''
         }else{
         self.loginType = 'username'
         }
         }
         }
         })
        }
        
        </script>
        <body>
         <div id="app">
         <div style="color:red">v-if的簡單實用</div>
         <template>
         <div v-if="type == 'A'">
         A
         </div>
         <div v-else-if="type=='B'">
         B
         </div>
         <div v-else>
         C
         </div>
         </template>
         <div style="color:green">v-if的彈框切換</div>
         <template v-if="loginType === 'username'">
         <label>用戶名:</label>
         <input placeholder="Enter your username" key="username-input">
         </template>
         <template v-else>
         <label>密碼:</label>
         <input placeholder="Enter your email address" key="email-input">
         </template>
         <button @click="changeloginType">切換狀態</button>
         </div>
        </body>
        </html>
        

        效果圖:

        vue v-if

        vue v-if

        以上這篇對vue中v-if的常見使用方法詳解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

        聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        對vue中v-if的常見使用方法詳解

        對vue中v-if的常見使用方法詳解:使用過Vue的小伙伴一定使用過v-if 這個屬性,但是這個屬性主要是來干什么的呢,他得用途是那些? 這里我總結了一下,v-if使用一般有兩個場景: 1- 多個元素 通過條件判斷展示或者隱藏某個元素。或者多個元素 2- 進行兩個視圖之間的切換 下面我寫了兩個例子,
        推薦度:
        標簽: VUE if vue中
        • 熱門焦點

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 中文毛片无遮挡高潮免费| 亚洲国产精品精华液| 成年大片免费高清在线看黄| 免费人成网站在线观看10分钟| 亚洲热妇无码AV在线播放| 一级做a爰性色毛片免费| 免费成人av电影| 亚洲精品乱码久久久久久蜜桃图片| 国产成人精品久久免费动漫| 久久青草亚洲AV无码麻豆| 两个人看的www免费| 亚洲情a成黄在线观看| 免费观看四虎精品成人| 免费少妇a级毛片| 特级av毛片免费观看| jizzjizz亚洲| 一级中文字幕乱码免费| 亚洲日韩在线第一页| aa级女人大片喷水视频免费 | 搡女人免费免费视频观看| 亚洲另类少妇17p| 99久久免费国产特黄| 亚洲国产精品高清久久久| 日韩视频免费在线观看| 亚洲综合在线观看视频| 成人免费视频77777| 中文字幕亚洲码在线| 国产精品免费小视频| 黄页网址在线免费观看| 国产亚洲色视频在线| 大地影院MV在线观看视频免费| 亚洲精选在线观看| 免费精品国产自产拍在 | 亚洲精品午夜无码专区| 日本在线看片免费| 亚洲成aⅴ人在线观看| 夫妻免费无码V看片| 无码毛片一区二区三区视频免费播放 | 麻豆成人久久精品二区三区免费 | 亚洲一区二区三区久久久久| 成全影视免费观看大全二|