J'ai donc ces objets dans la matrice à partir d'une demande d'une API
<template>
<div>
<Navbar />
<gamesIdeaList :games="games" />
</div>
</template>
<script>
// @ is an alias to /src
import Navbar from '@/components/Navbar.vue'
import gamesIdeaList from '@/components/gamesIdeaList.vue'
import axios from 'axios'
export default {
name: 'home',
components: {
Navbar,
gamesIdeaList
},
data() {
return {
games:[]
}
},
// props: info,
mounted () {
axios.get('http://localhost:3001/GamesIdea', {
headers: { Authorization: `Bearer ${localStorage.usertoken}` }
})
.then(res => {
this.games = res.data.data
console.log(arr)
})
.catch(error => {
console.log(error)
this.errored = true
})
}
}
</script>
3 Réponses :
Essayez d'utiliser la fonction de mapper code> de la carte de tableau comme suit:
this.games = res.data.data.map(d=>{Title: d.Title,Description:d.Description});
En effet, il fonctionne, alors je passe deux accessoires un pour titre et un pour la description?
Voulez-vous passer à la fois le titre et la description à la composante enfant?
Vous pouvez essayer aussi
<div>
<Navbar />
<gamesIdeaList :games="games" />
</div>
</template>
<script>
// @ is an alias to /src
import Navbar from '@/components/Navbar.vue'
import gamesIdeaList from '@/components/gamesIdeaList.vue'
import axios from 'axios'
export default {
name: 'home',
components: {
Navbar,
gamesIdeaList
},
data() {
return {
games:[]
}
},
// props: info,
mounted () {
axios.get('http://localhost:3001/GamesIdea', {
headers: { Authorization: `Bearer ${localStorage.usertoken}` }
})
.then(res => {
this.games = res.data.map(val => {
return {
Title: val.Title,
Description:val.Description}
})
console.log(arr)
})
.catch(error => {
console.log(error)
this.errored = true
})
}
}
</script>```
Oui peut ajouter du champ Vous ne voulez pas en retour
Solution 1 strong> p> this.games = res.data.data.map(obj => {
Title: obj.Title,
Description: obj.Description
});
@Anabel s'il vous plaît vérifier la réponse il est mis à jour avec une nouvelle solution
Son travail toute la solution fournis travaille, merci beaucoup
@Anabel, veuillez accepter ma réponse si cela fonctionne bien pour vous. Merci.
Veuillez essayer ceci
ceci.games = res.data.data.map (d => {titre: d.title, Description: D.Description});