vue的keep-alive使用
阿新 • • 發佈：2021-12-10
tab在後臺專案中也比較常用的。假設我們有四個tab選項，每個tab都會向後端請求資料，但我們希望一開始只會請求當前的tab資料，而且tab來回切換的時候不會重複請求，只會例項化一次。首先我們想到的就是用
作者：花褲衩
連結：https://juejin.cn/post/6844903481224986638
來源：稀土掘金
著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。
v-if 這樣的確能做到一開始不會掛載後面的tab，但有一個問題，每次點選這個tab元件都會重新掛載一次，這是我們不想看到的，這時候我們就可以用到<keep-alive>了。
keep-alive 包裹動態元件時，會快取不活動的元件例項，而不是銷燬它們。 它是一個抽象元件：它自身不會渲染一個 DOM 元素，也不會出現在父元件鏈中。
所以我們就可以這樣寫tabs了
<el-tabs v-model="activeTab">
<el-tab-pane label="簡介及公告" name="announcement">
<announcement />
</el-tab-pane>
<el-tab-pane label="資訊" name="information">
<keep-alive>
<information v-if
作者：花褲衩
連結：https://juejin.cn/post/6844903481224986638
來源：稀土掘金
著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。