Vue 3 中的数据绑定是通过模板语法实现的。开发者可以在模板中使用特殊的语法来绑定数据，例如使用双花括号 {
{}} 来显示数据，或者使用 v-bind 指令来绑定属性。
当数据发生变化时，Vue 会自动更新绑定的数据在模板中的显示，实现页面的自动更新。
虽然 Vue 的响应式数据驱动模式非常强大，但有时直接访问底层 DOM 元素是必要的。
vue3 内置的特殊属性ref
ref 是一个特殊的 attribute，它允许在一个特定的 DOM 元素或子组件实例被挂载后，获得对它的直接引用。
ref用于注册元素或子组件的引用。ref参数类型：string | Function- 当使用字符串作为参数时，这个字符串将作为引用的名称，可以在组件的逻辑部分通过
this.$refs[refName]来访问对应的元素或组件实例。 - 当使用函数作为参数时，这个函数将在组件挂载后被调用，函数的参数是对应的元素或组件实例。
- 当使用字符串作为参数时，这个字符串将作为引用的名称，可以在组件的逻辑部分通过
使用选项式 API，引用将被注册在组件的 this.$refs 对象里
<!-- 存储为 this.$refs.p -->
<p ref="p">hello</p>
使用组合式 API，引用将存储在与名字匹配的 ref 里
用在普通DOM标签上，获取的是DOM节点
示例：
<template>
<div>
<div ref="domDiv">hi, 这是有ref属性的div</div>
<button @click="showLog">点击输出div</button>
</div
最低0.47元/天 解锁文章
扫一扫
2535
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
