Vue

Template Refs

在使用 Composition API 时,想要访问 template 的 dom 元素,需要在 setUp 函数里为 template 声明一个对应的 ref 对象,并从 setup()里返回。

<template>
  <div ref="root"></div>
</template>
<script>
  import { ref, onMounted } from 'vue'
  export default {
    setup() {
      const root = ref(null)
      onMounted(() => {
        // 组件被创建完成后,这个Dom元素被分配给了ref。
        console.log(root.value) // <div/>
      })
      return {
        root
      }
    }
  }
</script>
下一节:前面的所有示例我们都用了createComponent来创建组件,是时候来真正揭开它的真面目了。没错,它的作用是用来让我们使用 Typescript 来编写代码的,这样我们的代码就拥有了类型推导。