カクカクしかじか

技術的なアレコレ

Nuxt2でsetup関数とOptions APIを併用しないといけない場合のデータの受け渡し方法

背景

Options APIAPIを叩いている箇所はそのままで、setup関数内のプロパティにそのAPIの戻り値をセットしたい状況がありました。
setupとOptions APIでデータをやり取り出来たはずだけど、どうすればよかったっけ?... と悩んでしまったので、本稿はその方法の備忘録です。

結論

setup関数で定義したref型のプロパティは、Options API内で this.fuga の形式でアクセス出来るので、そこに値をセットすればOKでした 🙆

setup関数内

setup() {
  const accountStatus = ref<AccountStatus>();
}

Options API

this.$axios.get<{ account: Account }>("/v1/account").then((res) => {
   this.accountStatus = res.data.account.status;
});