axiosのgetのレスポンスが正しくとれない

Question

前提・実現したいこと

APIのResponseで来る値を使いたい。
axiosを使ってAPIを呼び出しましたが、responseに入っている値がおかしい。
(Chrome Developer Toolで確認した場合は問題なく取得できている)

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

axiosを使って、nuxtのpages/**.vue内の
createdにて

axios.get('/api/test')
.then(response => {
  console.log(response.data);
})

と呼び出しているのですが、response.dataの値が空です。
が、Chrome Developer Toolで確認したAPIのResponseには要素が1つ入った配列が入っている状態です。

エラーメッセージ

ターミナルを確認したところ、
UnhandledPromiseRejectionWarning: Error: Can't set headers after they are sent.
が発生している。

該当のソースコード

export default {
  ・・・
  created: function() {
    axios
      .get("/api/test")
      .then(response => {
        console.log("body:", response.data); // 要素1つが入っている配列が返るはずが、空
      })
      .catch(err => {
        console.log("err:", err);
      });
  },
　・・・

試したこと

• コンソールでのログ出力確認
• Chrome Developer ToolでNetworkを確認
• ブラウザで直接/api/testと叩くと正しい値(要素1つの配列)が返る

補足情報（FW/ツールのバージョンなど）

node: 8.15.1
express: 4.16.1
routing-controllers: 0.7.7

ぜひ宜しくお願い致します。

Comments

[FeLvi_zzz]

Developer Toolでは正常に取得できるというのが不可解ですが、/api/testのExpress側のコードも見せていただけますか？

[apptail]

自己解決しました。
取得自体は出来ていたようです。
ご確認ありがとうございました！

Answer 1

自己解決しました。

Chromeのコンソールでも配列の中身が見れたため、
実際には配列の要素が取れていないのではなく、
ターミナルに出力されるresponse.dataが
配列を表示しない仕様のようです。
実際に取得した値をtemplateにはめることが出来たため、
取得できていないというのが勘違いで、解決とさせて頂きます。

また、エラーメッセージについては別件のようです。