未捕獲的類型錯誤：無法設置未定義的屬性（設置“isSubcon”）

Question

在這里需要一些幫助。

我希望我的導航抽屜根據登錄者的用戶類型/角色顯示不同的內容。

但是我遇到了這個錯誤（“Uncaught TypeError：無法設置未定義的屬性（設置'isSubcon'”）。我的導航抽屜沒有顯示任何內容。

我的template

<v-list v-if="isSubcon">
    //content of drawer if user that logged in is a "Subcon"
</v-list>

<v-list v-if="isWPC">
    //content of drawer if user that logged in is a "WPC"
</v-list>

<v-list v-if="isBWG">
    //content of drawer if user that logged in is a "BWG"
</v-list>

我的script

data: () => ({
    isSubcon: false,
    isWPC: false,
    isBWG: false,
}),

// I think below is where the problem occurs.
created() {
    firebase
        .auth()
        .onAuthStateChanged((userAuth) => {
            if (userAuth) {
                firebase
                    .auth()
                    .currentUser.getIdTokenResult()
                    .then(function ({
                            claims,
                        }) {
                            if (claims.customer) {
                                this.isSubcon = true;  //HERE WHERE THE PROBLEM OCCURS (i think)
                            } else if (claims.admin) {
                                this.isWPC =true;  //THIS ALSO
                            } else if (claims.subscriber) {
                                this.isBWG = true;  //AND THIS ALSO
                            }
                           }
                        )
                }
            });
    },

我正在使用 Firebase 自定義聲明登錄和 Nuxt（模式：SPA）和 Vuetify 的 UI。 那么如何消除錯誤，以便將內容顯示到導航抽屜？

先感謝您：））

Answer 1

this始終取決於調用的范圍/對象以及兩個屬性data: () => ({... })和created()似乎是另一個 object 的屬性。 如果你調用它：

myObject.created();

那么下面的解決方案應該可以做到。

created() {
  let that = this;
  firebase
   ...
    .then(function ({ claims }) {
      if (claims.customer) {
        that.isSubcon = true;  //HERE WHERE THE PROBLEM OCCURS (i think)
      } else if (claims.admin) {
        that.isWPC =true;  //THIS ALSO
      } else if (claims.subscriber) {
        that.isBWG = true;  //AND THIS ALSO
      }
    })
}