Vue.js組件tab實現選項卡切換？如何實現Tab選項卡內容的懶加載？小白，一個還在成長的前端工程師，如果有什么錯誤，以后要學會改正！制表符切換在項目中使用得太頻繁。為了提高性能，只需進入頁面并要求

Vue.js組件tab實現選項卡切換？

如何實現Tab選項卡內容的懶加載？

小白，一個還在成長的前端工程師，如果有什么錯誤，以后要學會改正！制表符切換在項目中使用得太頻繁。為了提高性能，只需進入頁面并要求他在當前頁面中只加載一個選項卡。這樣，一旦進入頁面，所有數據都將被加載。如果數據太多，用戶將等待加載數據。用戶體驗很差。現在項目使用元素UI的tab效果。其原理是顯示和隱藏顯示。這里的問題是，這種隱藏是看不到的，但是DOM渲染仍然會被渲染。因此，為了解決這個問題，我們使用V-IF讓當前頁面為真，下一個頁面為假，這樣當你點擊時，你可以在你點擊的標簽下請求創(chuàng)意。當然，你不能總是讓它是V-IF，否則性能會更差，所以我們以后可以繼續(xù)點擊哪個選項卡是true，記住其他選項卡不需要改為false，因為這些元素UI已經完成，以后會自動繼續(xù)顯示，這樣就不需要頻繁地操作DOM，提高了DOM的性能。我不知道是否有什么錯誤。如果有任何錯誤，請原諒我。稍后，我將更改

這三個子組件的代碼引用，分別是：

JS，使用本地組件來引入這三個子組件

//data（）{

return{

A:“tab1”//默認顯示tab1子組件

}

]組件：{

“tab1”：tab1，

“TAB2”：TAB2“tab3”：tab3

}