vuejs / vue

This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core
http://v2.vuejs.org
MIT License
207.66k stars 33.67k forks source link

TypeError: Cannot read property 'length' of undefined #6018

Closed ahmedkhan847 closed 7 years ago

ahmedkhan847 commented 7 years ago

Version

2.3.4

Reproduction link

https://github.com/ahmedkhan847/commentwithlaravelandvue/blob/master/resources/assets/js/components/Comments.vue

Steps to reproduce

Working with vuejs as I upgraded to vuejs2 I am unable to get the length of an array exist within an array. I am unable to get its length inside a vuejs function but not in template.

<div class="form-row reply" v-if="comment.replies.length > 1">
                    <a v-if="viewcomment[index]" @click="showComments(index)">Hide comments {{comment.replies.length - 1}}</a>
                    <a v-else @click="showComments(index)">View more {{comment.replies.length - 1}} comments </a>
                </div>

What is expected?

I was expecting to get the length of array.

What is actually happening?

I am getting error "TypeError: Cannot read property 'length' of undefined"

yyx990803 commented 7 years ago

This is not a valid repro because it's part of a project, and more like a question than a bug report. Please either reduce the scope to a minimal repro or ask via other channels instead.

ghost commented 7 years ago

@ahmedkhan847 v-if="comment.replies && comment.replies.length > 1" will do the trick.

Your data is empty when component is mounted (because you get it asynchronously), so you need an additional guard.

shibnathroy commented 5 years ago

@ahmedkhan847 v-if="comment.replies && comment.replies.length > 1" will do the trick.

Your data is empty when component is mounted (because you get it asynchronously), so you need an additional guard.

Thank You

usmanbasharmal123 commented 4 years ago

just try this it will work v-if="comment.replies!=undefined && comment.replies.length > 1"