欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue toggle做一個點擊切換class(實例講解)

 更新時間:2018年03月13日 15:58:45   作者:longzhoufeng  
下面小編就為大家分享一篇使用vue toggle實現(xiàn)點擊切換class的示例。具有很好的參考價值。希望對大家有所幫助。一起跟隨小編過來看看吧

實例如下所示:

<template>
  <div>
    <span :class="{'bg-primary text-danger':isA,'bg-success text-white':!isA}" @click="toggle()">AAAAA</span>
  </div>
</template>
<script>
  export default {
    name: 'hello',
    data () {
      return {
        isA: false
      }
    },
    methods:{
      toggle:function () {
        this.isA=!this.isA
      }
    }
  }
</script>
<style scoped>
  @import "../../../src/assets/plugin/bootstrap-4.0.0-alpha.6-dist/css/bootstrap.css";
</style>

以上這篇vue toggle做一個點擊切換class(實例講解)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。

相關文章

  • vue通過子組件修改父組件prop的多種實現(xiàn)方式

    vue通過子組件修改父組件prop的多種實現(xiàn)方式

    這篇文章主要介紹了vue通過子組件修改父組件prop的幾種實現(xiàn)方式,比較常用的方式是通過Prop單向傳遞的規(guī)則,需要的朋友可以參考下
    2021-09-09
  • Vue?axios和vue-axios的關系及使用區(qū)別

    Vue?axios和vue-axios的關系及使用區(qū)別

    axios是基于promise的HTTP庫,可以使用在瀏覽器和node.js中,它不是vue的第三方插件,vue-axios是axios集成到Vue.js的小包裝器,可以像插件一樣安裝使用:Vue.use(VueAxios, axios),本文給大家介紹Vue?axios和vue-axios關系,感興趣的朋友一起看看吧
    2022-08-08
  • Vue整合AdminLTE模板的方法

    Vue整合AdminLTE模板的方法

    這篇文章主要介紹了Vue整合AdminLTE模板的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-05-05
  • vue3 Teleport瞬間移動函數使用方法詳解

    vue3 Teleport瞬間移動函數使用方法詳解

    這篇文章主要為大家詳細介紹了vue3 Teleport瞬間移動函數使用方法,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-03-03
  • Vue分頁插件的前后端配置與使用

    Vue分頁插件的前后端配置與使用

    這篇文章主要為大家詳細介紹了Vue分頁插件的前后端配置與使用,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2019-10-10
  • Vue3中#default=“scope”的使用

    Vue3中#default=“scope”的使用

    在Vue3中,我們經常會遇到需要處理列表渲染的情況,Vue3引入了一種新的語法,即#default=“scope”,本文就來介紹一下Vue3中#default=“scope”的使用,感興趣的可以了解一下
    2023-10-10
  • Vue實現(xiàn)自動檢測以及版本的更新

    Vue實現(xiàn)自動檢測以及版本的更新

    當用戶在當前站點停留時間比較長,中途站點進行升級更新之后,用戶如果不刷新頁面就任然停留在舊的頁面里,如何讓用戶收到一個提示,引導用戶進行更新操作呢?下面給大家介紹如何站點更新如何在生產環(huán)境提示用戶更新,進行頁面刷新操作,核心原理其實很簡單
    2023-03-03
  • vue如何使用rem適配

    vue如何使用rem適配

    這篇文章主要介紹了vue如何使用rem適配,幫助大家處理vue開發(fā)移動應用時的兼容性問題,感興趣的朋友可以了解下
    2021-02-02
  • vue-element-admin后臺生成動態(tài)路由及菜單方法詳解

    vue-element-admin后臺生成動態(tài)路由及菜單方法詳解

    vue-element-admin后臺管理系統(tǒng)模板框架 是vue結合element-ui一體的管理系統(tǒng)框架,下面這篇文章主要給大家介紹了關于vue-element-admin后臺生成動態(tài)路由及菜單的相關資料,需要的朋友可以參考下
    2023-09-09
  • Vue.js使用computed屬性實現(xiàn)數據自動更新

    Vue.js使用computed屬性實現(xiàn)數據自動更新

    在Vue組件中,computed屬性是在組件的選項對象中聲明的,你可以把它們想象成組件的一個小功能,告訴Vue當某些數據變化時,如何更新界面,本文給大家介紹了Vue.js使用computed屬性實現(xiàn)數據自動更新,需要的朋友可以參考下
    2024-06-06

最新評論