From d3b1b76ea17100fca65aeeb6af31d47e4a639551 Mon Sep 17 00:00:00 2001
From: anne-lxm <1076217653@qq.com>
Date: Tue, 30 Mar 2021 20:54:57 +0800
Subject: [PATCH] =?UTF-8?q?vue=20=E6=96=B0=E5=A2=9Eref?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
docs/vue-components.md | 107 +++++++++++++++++++++++++++++++++++++++++
1 file changed, 107 insertions(+)
diff --git a/docs/vue-components.md b/docs/vue-components.md
index ab87ccdd0..b6add4357 100644
--- a/docs/vue-components.md
+++ b/docs/vue-components.md
@@ -358,6 +358,113 @@
+
+
+
+## ref
+
+
+被用来给元素或子组件注册引用信息,引用信息将会注册在父组件的 `$refs` 对象上。
+
+如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素;如果用在子组件上,引用就指向组件实例:
+
+```html
+
+//非H5端不支持通过this.$refs.content来获取view实例
+hello
+
+//支持通过this.$refs.child来获取child-component实例
+
+
+```
+
+
+当 `ref` 和 `v-for` 一起用于元素或组件的时候,引用信息将是包含 DOM 节点或组件实例的数组。
+
+
+
+**关于 ref 注册时间的重要说明:**
+
+因为 `ref` 本身是作为渲染结果被创建的,在初始渲染的时候你不能访问它们,它们还不存在!`$refs` 也不是响应式的,因此你不应该用它在模板中做数据绑定。
+
+
+
+
+#### 子组件ref
+
+
+尽管存在 prop 和事件,有的时候你仍可能需要在 JavaScript 里直接访问一个子组件。
+访问子组件实例或子元素,通过 ref 为子组件赋予一个 ID 引用,在vue的js中可通过`this.$refs.XXX`来获取到组件对象。
+
+```html
+
+```
+
+你已经定义了这个 ref 的组件里,你可以使用:`this.$refs.usernameInput`来访问这个` `实例。
+
+##### 示例:
+
+```html
+//base-input子组件页面
+
+
+
+
+
+
+```
+
+
+允许父级组件通过下面的代码聚焦` ` 里的输入框:
+
+
+```html
+//index 父组件页面
+
+
+
+
+
+
+
+```
+
+
+**注意**
+
+> 非H5端只能用于获取自定义组件,不能用于获取内置组件实例(如:view、text)
+
+
+
+
+
+
+
+
+
## 自定义事件
### 将原生事件绑定到组件
--
GitLab