vue單頁面條件下添加類似瀏覽器的標簽頁切換功能


在用vue開發的時候,單頁面應用程序,而又有標簽頁這種需求,各種方式實現不了,

從這個

 

到這個,然后再返回上面那個

 

 因為每個標簽頁的route不一樣,導致組件重新渲染的問題,怎么都不知道如何實現.........

簡直郁悶到爆炸,后來和同學談起的時候,說起生命周期這個才恍然大悟,

對於vue的生命周期,因為用的少,本身多用的是created,mounted這兩個,都忘記beforeDestroy這些了,然后抓瞎了好久

實現方式是

每次銷毀組件之前   緩存數據    能夠用到的是 this.$data
this.$data是這整個組件的數據

beforeDestroy(){

  //用的是vuex,其他sessionStorage什么的也行

  this.$store.dispatch('updateDate',this.$data )

}

然后組件創建時候

created(){

  if(this.$store.getters.pageData){

  Object.keys(this.$data).forEach(k=>{

    this.$data[ k ]=this.$store.getters.pageData[ k ];//整個時候不能整個直接一起賦值,會報錯;

    })

  }

}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM