🫥
Composition API でどうしても this を使いたい時の対処法
前提
-
Option API
->Composition API
への置き換え作業中 - Bootstrap Vue を使っている
やりたいこと
- Bootstrap Vue のモーダル
this.$bvModal
を書き換えたい。 -
ctx
やuseContext()
など、コンテキストの中には無い。どうしよう。。
結論
this
のかわりに getCurrentInstance()
を使う
Sample
import { defineComponent, getCurrentInstance } from "@nuxtjs/composition-api";
export default defineComponent({
setup() {
const instance = getCurrentInstance()
const close = () => {
ctx.emit("close");
instance.proxy.$bvModal.hide("modal"); // instance.proxy が this に相当
};
return { close };
},
});
🎉
※あくまで Nuxt3 移行するまでの応急処置として、多用しないほうがいいと思います。。
Discussion