[Vuejs]-How to correctly get object length in JS

1👍

Assuming the explanation is your data is loaded asynchronously and not available at component rendering.

The solution is to wrap your template into a whole check for forum.comments existence to avoid rendering the block before data is loaded. For instance :

<template v-if="forum && Array.isArray(forum.comments)">
  <div v-if="forum.comments.length === 0">
      <el-card>
          <p>
            No comments!
          </p>
      </el-card>
  </div>
  <div v-else>
      <div v-for="comment in forum.comments">
          <el-card>
              //show comments
          </el-card>
      </div>
  </div>
</template>

Leave a comment