首頁猿問關于vue中computed和mo...

關于vue中computed和mounted的執(zhí)行問題

JavaScript

肥皂起泡泡 2019-03-12 17:14:23

在vue組件中的computed中獲取了vuex中的屬性，然后在created生命鉤子中使用state中的屬性發(fā)送了請求發(fā)現(xiàn)mounted發(fā)送請求時參數(shù)沒有獲取到，頁面更新之后才正確：computed: { ...(mapState({ user_name: state => state.user_name, user_id: state => state.user_id, user_source: state => state.user_source, })) } created() { request(extend(true, {}, apis.getUserConsultInfo, { params: { consult_id: this.consult_id, user_id: this.user_id, user_source: this.user_source } })).then((res) => { console.log(res); }, (errmsg) => { this.$message.error(errmsg); }); }這種情況怎么破？求大神解決～～

查看完整描述

1 回答

慕絲7291255

TA貢獻1859條經(jīng)驗獲得超6個贊

凡是需要處理vuex的getter中的數(shù)據(jù)，均在beforeUpdate或者update階段進行。

8百年前做的一個實驗：笑納。

11個生命周期打印計算屬性值（前6個有輸出，后5個無輸出）

各生命周期打印從vuex的getter獲取到的計算屬性結果。

mounted階段的打印嘗試，其余的也類似：

mounted(){

console.log("mounted↓")

console.log(this.users)

}

從vuex getter獲取到的數(shù)據(jù)：

computed:mapGetters({

users:'allUsers'

}),

打印結果：

經(jīng)過觀察發(fā)現(xiàn)，vue組件生命周期的11個階段，只有前6個階段有輸出結果。
beforeDestroy，destroyed，activated，deactivated，errorCaptured都沒有輸出結果。
在前6個階段的初始輸出結果均不是有效數(shù)據(jù)，beforeCreate的undefined和其他階段的observer，均是無效數(shù)據(jù)。
直到16:28:33.740，才開始獲得有效數(shù)據(jù)，且只在before和updated階段獲取到數(shù)據(jù)。

我們根據(jù)實驗結果得出一個結論：凡是需要處理vuex的getter中的數(shù)據(jù)，均在beforeUpdate或者update階段進行。

反對回復 2019-03-25