J'ai donc configuré une base de données et j'essaie d'en extraire les informations et de les stocker dans un tableau d'état afin de pouvoir l'utiliser sur le site Web.
Voici un exemple de ce que j'obtiens lorsque je demande forme la base de données, raccourcie pour la lisibilité
other: ["name1", "name2"]
Donc ce dont j'ai besoin est de prendre le NeededInfo de chaque objet et de le stocker dans un tableau afin que je puisse l'utiliser sur render (). C'est ce que j'essaye, mais quand je fais printToConsole () (non montré mais juste un console.log (this.state)) pour voir à quoi ressemble le tableau d'état, le tableau «autre» n'est pas défini
const title_URL = "http://123.456.789/namelist";
class Project extends Component {
constructor(props) {
super(props);
this.state = {
random1: "",
random2: "",
other: [],
items: []
}
}
componentDidMount() {
fetch(title_URL)
.then(response => {
return response.json();
})
.then(data => {
this.setState({
other: data.results.NeededInfo
})
});
}
J'ai besoin que le tableau "other" ressemble à
{
"count": 10,
"next": null,
"previous": null,
"results": [
{
"var1": "Test",
"var2": "",
"NeededInfo": "name1",
},
{
"var1": "Test",
"var2": "",
"NeededInfo": "name2",
}
]
}
car dans mon render () je dois lister les noms que le site extrait de la base de données afin que l'utilisateur puisse voir les noms des éléments répertoriés et faire d'autres choses avec, puis je peux enregistrer cela dans le tableau "éléments", dans un nouvel ordre, mais cette partie fonctionne avec si j'ai un "autre" tableau prédéfini.
3 Réponses :
Utilisez map et extrayez la propriété souhaitée:
other: data.results.map(({ NeededInfo }) => NeededInfo)
Results est un tableau de documents.
Vous ne pouvez pas accéder à la propriété des documents à l'intérieur de ce tableau sans indiquer à JavaScript où se trouvent ces documents dans le tableau (index du document nécessaire).
Créez une boucle for, utilisez I start from 0, to length of results, et vous pourrez utiliser cette propriété de documents.
Vous devez obtenir NeededInfo à partir de votre résultat et le pousser dans un tableau temporaire (stocker uniquement les valeurs NeededInfo ), puis le mettre simplement à l'état. Par exemple:
componentDidMount() {
fetch(title_URL)
.then(response => {
return response.json();
})
.then(data => {
// Here you need to use an temporary array to store NeededInfo only
let tmpArray = []
for (var i = 0; i < data.results.length; i++) {
tmpArray.push(data.results[i].NeededInfo)
}
this.setState({
other: tmpArray
})
});
}
Vous pouvez marquer et accepter la réponse si cela fonctionne bien, afin que les autres puissent la voir, merci