TypeError：試圖訪問未定義的'property'

Question

我被困在一個奇怪的錯誤：當試圖顯示一個狀態變量時，vuejs警告我： 錯誤渲染函數：「TypeError：無法讀取屬性'token'未定義」

我的狀態看起來像這樣（在vuejs擴展名）：

room:Object 
    details:Object 
     game_id:"1" 
     id:914527404 
     max_users:5 
     messages:Array[0] 
     token:"ef6464692f4cce187fe129d7" 
     user:Array[1] 
    messages:Array[0] 
    users:Array[1] 

儘管錯誤，HTML仍然是正確呈現：

<button id="copySharingLink" type="button" class="btn btn-primary waves-effect waves-light" v-bind:data-token="room.details.token">some text</button> 

成爲

<button id="copySharingLink" type="button" data-token="ef6464692f4cce187fe129d7" class="btn btn-primary waves-effect waves-light">some text</button> 

我不知道如何擺脫這個錯誤，因爲它的工作。

Answer 1

可能有一段時間，room或room.details尚未設置，這可能是錯誤發生時。

嘗試改變從這個代碼...

v-bind:data-token="room.details.token" 

...這樣的：

v-bind:data-token="room.hasOwnProperty('details') ? room.details.token : ''"