取得したデータのオブジェクトから、変数で定義して扱いやすくしたいです。

Question

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

エラーメッセージ
```Uncaught (in promise) ReferenceError: data is not defined

### 該当のソースコード
var standings = data.standings[0].table
```ここに言語名を入力 vue.js
ソースコード
```var app = new Vue({
  el: '#app',
  data: {
    standings: null
  },
  mounted() {
    axios.get('https://api.football-data.org/v2/competitions/PD/standings?standingType=TOTAL', {headers: {"X-Auth-Token" : " apiトークン名 "},}).then(function(response){
      console.log(response)
      var vm = this
      var standings = data.standings[0].table
    })
    
  }
})

### 試したこと
html側で先にvue.jsのcdnを読み込むようにしてみたがだめだった。
ここに問題に対して試したことを記載してください。
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios@0.18.0/dist/axios.min.js"></script>
  <script src="js/vue.js"></script>
### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[WhiteTempest]

今後のためにも、
ひとつだけお願いがあります。

以下をご参考に、コードの記載を修正ください。
```
★この部分にコードを書く★
```

内容が見にくいです。。。

Answer 1

var standings = data.standings[0].table

恐らくこの部分で、data.が悪いのではないかと。

data is not defined.とあるので、
dataが定義(define)されていないとエラーになっています。

使い方が間違っており、
以下で解決しないでしょうか？

var standings = this.standings[0].table

■参考
以下の ユーザー入力の制御 の項が使い方として分かりやすいと思いますよ。
https://jp.vuejs.org/v2/guide/index.html

■その他気になること
Vueに入っているstandingsは、
どこか別で値を入れますよね？
現時点だと、null以外を設定しているように見えなかったので。。。