CODEWITHSUNDEEP
jsonvue.js
Nivyan
Nivyan

Reputation: 139

Loading JSON files from a JSON file, with paths to the JSON files

I'm sorry if this is a question that's been asked before but after spending half an hour looking for similar questions or documentation for it, I haven't found a working answer.

I have a JSON file which looks like this:

{
    "title": "path1.json",
    "title2": "path2.json",
     ...
}

What I'm trying to do is importing the JSON file which indexes these like this:

import indexJSON from "../../indexOfJSON.json";
...

    export default {
      data() {
        return {
          jsonIndexVariable: indexJSON,
        };
      },
    ...
    }

Which I can show in a list in vue:

<ul>
    <li v-for="(path, index) in jsonIndexVariable" :key="index">
        {{path}}
    </li>
</ul>

And the simple solution I'd assume would be doing

this.jsonIndexVariable.foreach...

in a method, but I can't for the life of me figure out how to do it.

Upvotes: 0

Views: 29

Answers (1)

Cosimo Chellini
Cosimo Chellini

Reputation: 1730

this happens because you are looping a object, instead of an array, vue is intelligent and automatically manages in v-for to cycle it, while in vanilla js you have to use

Object.entries(this.jsonIndexVariable).foreach()

(docs)

Upvotes: 1

Related Questions