Vue JSがデータを表示できません

Question

私のvueコンポーネントにデータを表示しようとしていますが、オブジェクトがある配列を持っています。私は

<div class="bar"> 
    {{playersStats[0]}} 
</div> 

を使用しようとする場合には、

{ "GP": 13, "GS": 6, "MPG": 20.74, "PPG": 12.85, "FGM": 4.46, "FGA": 9.77, "FGP": 0.46 } 

を表示しますが、私は

<div class="bar"> 
    <span v-if="playersStats[0]">{{playersStats[0].GS}}</span> 
</div> 

を使用してみた場合EDITED Javascriptを：

export default { 
    data: function(){ 
     return { 
      showPlayersSelection: true, 
      selectedPlayers: [], 
      playersStats: [] 
     } 
    }, 
    methods: { 
     selectPlayers(player) { 
      if(this.selectedPlayers.length < 2){ 
       this.selectedPlayers.push(player); 
       if(this.selectedPlayers.length == 2){ 
        this.getPlayerStats(this.selectedPlayers[0][0], this.selectedPlayers[1][0]); 
        this.showPlayersSelection = false; 
       } 
      } 
      return false; 
     }, 
     getPlayerStats(player1, player2) { 
      let self = this; 
      axios.get(config.API.URL + config.API.STATS, { 
       params: { 
        'player1Id': player1, 
        'player2Id': player2 
       } 
      }) 
      .then((response) => { 
       if(response.status == 200 && typeof(response.data) == 'object'){ 
        self.playersStats = []; 
        self.playersStats.push(response.data[0][0]); 
        self.playersStats.push(response.data[1][0]); 
       } 
      }); 
     }, 
    } 
} 

それが表示されますDOMでも何もない。データを表示するにはどうしたらいいですか？

Answer 1

<span v-if="playersStats[0]">{{playersStats[0]["GS"]}}</span> 

多分これは必要ですか？