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

VUE實(shí)現(xiàn)自身整體組件銷毀的示例代碼

 更新時間：2020年01月13日 14:26:02   作者：WC_ZIX  
這篇文章主要介紹了VUE實(shí)現(xiàn)自身整體組件銷毀的示例代碼,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

V-IF實(shí)現(xiàn)組件自身銷毀

前面說了一些自己怎么思考得來，如果時間急可直接看

最后~~~~

通知提示組件案例分析

在編寫一些簡單的通知組件案例中，可能會這樣去寫

//在[index.js]的install方法里
setTimeOut(()=>{
  document.body.removeChild([DOM])
, timer}
//定時的移除DOM

再看另一個Loading插件案例V-show

template :

<template>
 <div class="box-container" v-show="showLoading">
  <div class="box1"></div>
  <div class="box2"></div>
  <div class="box3"></div>
  <div class="box4"></div>
  <div class="box5"></div>
  <div class="box6"></div>
  <div class="content">loading</div>
 </div>
</template>

javascript :

 export default {
  name: 'loading',
  data(){
   return {
    showLoading: false
   }
  },
  methods: {
   show(){
    this.showLoading = true
   },
   hidden(){
    this.showLoading = false
   }
  },
  mounted() {
   console.log('Loading is mounted!!!')
  },
 }

看完上一個聯(lián)想V-IF控制DOM渲染

因此在template里div最外層綁定v-if屬性就可以,再有方法控制其值即可

template :

<template>
 <div id="text" v-if="canShow">
  <div>aaaaaaaaaaaaa</div>
 </div>
</template>
javascript :

export default {
 name: 'Test',
 data() {
  return {
   canShow: true
  }
 },
 mounted() {
  setTimeout(()=>{
   this.canShow = false
  },1000)
 }
}

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論