📑

composition-api プラグインでのrefsの使い方

2021/04/07に公開

composition-apiプラグインはvue2でComposition APIを使うためのプラグインなので、以下のVue3のガイドと同じようにはrefsは扱えません。
https://v3.vuejs.org/guide/composition-api-template-refs.html

composition-apiプラグインではcontextにrefsが入ってるようなので、それを利用することで取得できました。

export default {
  setup(initProps, setupContext) {
    const refs = setupContext.refs
    onMounted(() => {
      // the DOM element will be assigned to the ref after initial render
      console.log(refs.root) // <div/>
    })
  },
}

ちゃんとプラグインのREADMEを見ずにVue3のドキュメントを見て実装したりしてたので、ちょっとつまづきました。(これからはちゃんとREADMEみよう)

Discussion