我可以在这里设置状态吗？反应本机

Question

在 getMatches 函数中，我想设置状态，以及与 leagueID 关联的比赛。我运行遇到问题的地方是如何在 get Matches function.The 获取响应中设置 setState 准确地给出我想要返回的内容。它是一个包含与 LeagueID 关联的匹配项的数组。 setState 将运行两次，因为我使用了 2 个 leagueId。任何帮助或建议将不胜感激。

export default class MatchView extends Component {

 state = {
  matches: null,
  leagueName: null
 }

 componentWillMount = () => {

  this.getLeagueNames();
 }//end componentwwillMOunt

 // componentDidMount = () => {
 //  console.log("league_array", this.state.leagueName)

 // }
 
 getLeagueNames = () => {
   let leagueArray = [];

   fetch(`https://apifootball.com/api/?action=get_leagues&APIkey=42f53c25607596901bc6726d6d83c3ebf7376068ff89181d25a1bba477149480`)
    .then(res => res.json())
     .then(leagues => {
      leagues.map(function(league, id){
       leagueArray = [...leagueArray, league]
      })//end .map
        this.setState({
         leagueName: leagueArray
        }); 
     })
 }// end getLeagueNames

 getMatches = (leagueID) => {
  let LeagGamesArray = [];
  console.log('working')
  fetch(`https://apifootball.com/api/?action=get_events&from=2016-10-30&to=2016-11-01&league_id=${leagueID}&APIkey=42f53c25607596901bc6726d6d83c3ebf7376068ff89181d25a1bba477149480`)
      .then(res => res.json())
       .then(fixtures => {

        LeagGamesArray = [...LeagGamesArray, fixtures]

       ** this.setState({
         matches: LeagGamesArray
        }) ** Setting the state here dosent work, just keeps running the code over and over again.**strong text**             
       })
        
     }
     
     //console.log(this.state.matches) 
      
      //console.log(this.state.matches)
      //console.log(this.state.matches)
 

 renderItem = () => {
  if(this.state.leagueName != null){
     return this.state.leagueName.map(function(league){
      
      let leagueID = league.league_id
      let fix = this.getMatches(leagueID)
      //console.log(fix)
    
     return (
      <LeagueName key={league.country_id} league={league}/>
     )
     
    }.bind(this))//end maps..We .bind(this) b/c we want to change the meaning of this. We first use it in the .map function, but we also want to use this to call the getMacthes function.
   } else {
     return null;
   }
 }//end renderItem

 

 render(){
  return (
   <ScrollView>
      {this.renderItem()}
     </ScrollView>     
  )
 }
}

强文本

Answer 1

您的 renderItem 方法调用 getMatches(leagueID)，这会触发您的 fetch，从而导致 setState 和随后的 render...并重复。

您应该从其他地方调用 getMatches，例如 componentWillMount。或者通过您用来生成刷新的一些用户交互（甚至计时器）。

我可以在这里设置状态吗？反应本机

Can i set the state here? React-Native

javascript

fetch

reactjs

react-native

react-native-ios