Json Array-Objekt Zugriff

Question

ich etwas Hilfe json Array in Abrufen von Daten Form in der Verbindung

Datei will ist

Html 
    <div> 
    <div v-for="data in myJson.id " >{{ data }}</div> 
    </div> 
     js 
    import json from '.././json/data.json' 
     export default { 
    components: { 
     MainLayout, 
    }, 
    data: function(){ 
     return { 
      myJson:json 
     } 
     }, 
    method:{ 
    getjson:function(){ 
     this.json = JSON.parse(myJson); 
    } 
    } 
    } 

Ich mag den Zugriff auf die Daten nur mit einer spezifischen ID und ich kann es nicht die Syntax zugreifen ich bin mit

bearbeiten Json file

Answer 1

Anscheinend Sie brauchen nicht einmal JSON.parse. Es scheint, ohne sie zu arbeiten ... Setzen Sie Ihre JSON-Datei im selben Verzeichnis wie die Komponente und versuchen Sie dies:

import data from './data.json' 

export default { 
    created() { 
    for (const item of data[0]['file']) { 
     console.log(` 
     Name: ${item.name} 
     Type: ${item.type} 
     Size: ${item.filesize} 
     Dimensions: ${item.dimension[0].width}x${item.dimension[0].height} 
     `) 
    } 
    } 
} 

Sie sollen Informationen aus Ihrer JSON-Datei in der Konsole beim Laden der Seite sehen.

Answer 2

<script> 
    import MainLayout from '../layouts/Main.vue' 
    import json from '.././json/data.json' 

    export default { 
    components: { 
     MainLayout, 
    }, 
    data: function(){ 
    return { 
    myJson: json[0].file 
    } 
    }, 
    method:{ 

    } 
    } 
</script> 

html 
    <div v-for="data in myJson"> 
    {{ data.name }} 
    {{ data.filesize}} 
    {{ data.dimension[0].width}}x{{data.dimension[0].height}} 
    </div> 

den obigen Code mit i implementiert genutzt und verwendet nach meinen Bedürfnissen und es funktionierte