How to parse vue array with different types?

Question

Vue.js

{
  "posts": [
    {
      "id": 1,
      "title": "someTitlePost",
      "author": "someName"
    }
  ],
  "worke": [
    {
      "area": "frontend"
    }
  ],
  "comments": [
    {
      "id": 1,
      "body": "some comment",
      "postId": 1
    }
  ],
  "profile": {
    "name": "typicode"
  }
}

I parse the array like this:

<ul v-for="(link, index) in links" :key="index">
        <li>
          <strong>{{ index }}</strong>
          <ul>
            <!-- v-if="link.length >
            <li v-for="el in link" >
              
              <p v-for="(prop, index) in el" >
               
                  <span>{{ index }} :</span>
                  <span >{{ prop }} </span>
              </p>
            </li>
          </ul>
        </li>
      </ul>

BUT! Due to the fact that the last element is an object (profile), it is displayed like this:


How to solve the problem correctly, with a minimum number of actions?

Answer 1

with a minimum number of steps

Well, whatever you say.
Replace v-for="el in link"with v-for="el in [].concat(link)".