response.filter

[Costle784]

hey, I keep getting an error saying 'response.filter is not a function'. Is the syntax correct here? Thanks

axios.get(`http://localhost:3000/teams/${this.state.teamid}/pastgames`).then((response) => {
      response.filter((game) => {
        return this.state.opponent === game.opp && this.state.matchingPhases.forEach((phase) => {
           game.date === phase.date
        })
      })

[Costle784]

https://github.com/Costle784/Moonbats latest changes are pushed. This is within the SelectedGame component

[juancgarcia]

@Costle784 There's a couple of issues here.

First it seems that axios is not preserving this for you so we'll need to make an alias with let self = this.

The response you're getting back from axios is not directly your data array, you'll need to use response.data to get the actual array.

Lastly, you were using .map as a search for moonphase/game matches, but .find is more appropriate for selecting just one item.

Compare this click method with your own:

  handleClick() {
    let self = this;
    axios.get(`http://localhost:3000/moonphases?date=${self.state.date}`).then((response) => {
     self.setState({
       matchingPhases: response.data
     })
    axios.get(`http://localhost:3000/teams/${self.state.teamid}/pastgames`).then((response) => {
      let filteredGames = response.data.filter((game) => {
        let moonMatch = self.state.matchingPhases.find((phase) => {
          return game.date === phase.date
        })
        return self.state.opponent === game.opp && !!moonMatch
      })
      self.setState({
        matchingGames: filteredGames
      })
    })
  })
  }

Also for readability, it might make sense to make the urls into let variables in order for the axios calls to be a little shorter horizontally.