TypeError: trying to access 'property' on undefined

Question

I'm stuck on a strange error: when trying to display a state variable, vuejs warns me: Error in render function: "TypeError: Cannot read property 'token' of undefined"

My state looks like this (in the vuejs extension):

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]

Despite the error, the HTML is still rendered correctly:

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

becomes

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

I have no idea how to rid out of this error, since it's working.

Nathan Wailes · Accepted Answer · 2017-07-07 11:30:36Z

1

There may be a time when room or room.details is not yet set, and that may be when the error is getting thrown.

Try changing the code from this...

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

...to this:

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

answered Jul 7, 2017 at 11:30

Nathan Wailes

12.6k10 gold badges77 silver badges118 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

TypeError: trying to access 'property' on undefined

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related