在Vue中，除了常見的生命周期函數(shù)created、mounted、updated和destroyed之外，還有一個(gè)不太常用的生命周期函數(shù)deactivated。

deactivated生命周期函數(shù)在組件被切換離開時(shí)被調(diào)用，它和activated生命周期函數(shù)是一對，activated被調(diào)用時(shí)組件被激活，deactivated被調(diào)用時(shí)組件被停用。這里的激活和停用指的是組件的可見性，例如組件被包含在v-if或者是router-view組件內(nèi)部，當(dāng)它被切換出去時(shí)就會被停用。

使用deactivated和activated生命周期函數(shù)可以實(shí)現(xiàn)一些特殊的功能，例如當(dāng)組件被切換離開時(shí)保存組件的狀態(tài)，在組件被切換回來時(shí)恢復(fù)組件狀態(tài)，達(dá)到類似瀏覽器中的前進(jìn)后退功能。

export default {
data() {
return {
cache: {}
};
},
deactivated() {
let key = this.$route.path;
this.cache[key] = this.$data;
},
activated() {
let key = this.$route.path;
if (this.cache[key]) {
Object.assign(this.$data, this.cache[key]);
}
}
};

上面的代碼實(shí)現(xiàn)了一個(gè)簡單的緩存組件數(shù)據(jù)的功能，當(dāng)組件被切換離開時(shí)保存組件的數(shù)據(jù)，當(dāng)組件被停用時(shí)恢復(fù)組件狀態(tài)。

除了保存組件數(shù)據(jù)外，deactivated和activated生命周期函數(shù)還可以實(shí)現(xiàn)其他的功能，例如在組件被切換出去時(shí)取消組件的定時(shí)器等。

export default {
data() {
return {
timer: null
};
},
methods: {
startTimer() {
this.timer = setInterval(() =>{
console.log("timer");
}, 1000);
},
stopTimer() {
clearInterval(this.timer);
}
},
activated() {
this.startTimer();
},
deactivated() {
this.stopTimer();
}
};

上面的代碼實(shí)現(xiàn)了一個(gè)簡單的定時(shí)器組件，當(dāng)組件被切換激活時(shí)啟動(dòng)定時(shí)器，當(dāng)組件被切換離開時(shí)停止定時(shí)器。這樣可以避免浪費(fèi)資源，當(dāng)組件不可見時(shí)停止定時(shí)器可以達(dá)到節(jié)省資源的目的。

總之，deactivated生命周期函數(shù)在Vue中雖然不太常用，但是它可以實(shí)現(xiàn)一些特殊的功能，例如保存組件的狀態(tài)和停止組件的定時(shí)器，可以在特殊的場景下使用。