vue 中的 activated 參數是一個生命周期函數,它會在組件被激活時調用。激活的含義是在切換路由時,從一個非活動的組件到達另一個活動的組件,然后再返回非活動組件時,會重新調用該組件的 activated 方法。
export default {
activated() {
console.log('組件被激活了');
}
}
在這段代碼中,activated 方法被定義在一個 vue 組件的導出對象中。當該組件被激活時,控制臺會輸出"組件被激活了"。這個方法可以作為一個 hook 函數,在組件被激活時執行一些特定的操作。
activated 方法與 created 和 mounted 方法不同,后兩者分別在組件被創建和加載到 DOM 中時調用,并且只調用一次。而 activated 方法可以被多次調用,因為組件可能在多個路由中被使用。因此,activated 方法適合完成一些與路由相關的操作,例如在路由變化時重置組件的數據。
export default {
data() {
return {
user: null
}
},
activated() {
if (!this.user) {
this.fetchUser();
}
},
methods: {
fetchUser() {
// 通過 API 獲取用戶信息
// 然后更新 data 中的 user
}
}
}
在這個例子中,當組件被激活時,會檢查是否已經獲取了用戶信息,如果沒有,則會發起 API 請求并更新 data 中的 user。這個操作只有在組件被激活時才會執行,可以保證每次返回該路由時都刷新用戶信息,同時避免重復的 API 請求。