Wie setze ich einen bestimmten Gegenstand im Array?

Question

In meiner App hole ich Daten von der API und lege sie in den Zustand der Komponente.

this.state = { 
 
    contributors: [], 
 
} 
 

 
componentDidMount() { 
 
    axios.get(data) 
 
     .then(res => this.setState({contributors: res}) 
 
}

this.state.contributors ist ein Array von Objekten. Jedes dieser Objekte hat 3 Eigenschaften mit Werten für weitere 3 API-Aufrufe.

0: { 
 
"name": "thisContributor", 
 
"followers_url": "https://api.github.com/users/thisContributor/followers", 
 
"gists_url": "https://api.github.com/users/thisContributor/gists", 
 
"repos_url": "https://api.github.com/users/thisContributor/repos", 
 
}

Jetzt muss ich durchlaufen, sagen wir 100 Mitarbeiter (oder alle von ihnen, aber das macht die Ladezeit wirklich lang) und jeder Mitwirkende mit einer Länge von Antwort aktualisieren. Ich dachte Eigenschaften diese Längen halten hinzuzufügen:

0: { 
 
"name": "thisContributor", 
 
"followers_url": "https://api.github.com/users/thisContributor/followers", 
 
"gists_url": "https://api.github.com/users/thisContributor/gists", 
 
"repos_url": "https://api.github.com/users/thisContributor/repos", 
 
"followers": -length of followers_url API response-, 
 
"gists": -length of gists_url API response-, 
 
"repos": -length of repos_url API response- 
 
}

Aber das funktioniert nicht:

for (let i = 0; i < 100; i++) { 
 
    axios.get(`${this.state.contributors[i].followers_url}?per_page=100&${API_KEY}`) 
 
    .then(res => { 
 
    this.setState({contributors[i].followers: res.data.length}) 
 
    } 
 
}

Wie das beheben, so dass ich kann Follower, GIS und Repos aktualisieren?

Answer 1

Versuchen Sie, diese

for (let i = 0; i < 100; i++) { 
    axios.get(`${this.state.contributors[i].followers_url}?per_page=100&${API_KEY}`) 
    .then(res => { 
    let tmp = [...this.state.contributors]; 
    tmp[i].followers = res.data.length 
    this.setState({contributors: tmp}) 
    } 
} 

Update:

fetch = (url, propertyName) => { 
    for (let i = 0; i < 100; i++) { 
     axios.get(url) 
     .then(res => { 
      let tmp = [...this.state.contributors]; 
      tmp[i][propertyName] = res.data.length 
      this.setState({contributors: tmp}) 
     } 
    } 
} 
... 
fetch(`${this.state.contributors[i].followers_url}?per_page=100&${API_KEY}`, "followers") 
fetch(`${this.state.contributors[i].gists_url}?per_page=100&${API_KEY}`, "gists") 
fetch(`${this.state.contributors[i].repos_url}?per_page=100&${API_KEY}`, "repos") 

Answer 2

Ich denke, das wird Ihr Problem lösen. Response ist ein Objekt und Sie ändern damit Ihr Array. Stattdessen können Sie die Antwort in Ihrem Array drücken.

componentDidMount() { 
    axios.get(data) 
     .then(res => this.setState((prevState)=>{contributors: [res, ...prevState.contributors]}) 
}