Vue2迁移-$children

发表于 | 分类于 |
字数统计: 159 字 | 阅读时长 ≈ 1 分钟

概览

$children 实例 property 已从 Vue 3.0 中移除，不再支持。

2.x 语法

在 2.x 中，开发者可以使用 this.$children 直接访问当前实例的子组件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<template>
  <div>
    <img alt="Vue logo" src="./assets/logo.png">
    <my-button>Change logo</my-button>
  </div>
</template>

<script>
import MyButton from './MyButton'

export default {
  components: {
    MyButton
  },
  mounted() {
    console.log(this.$children) // [VueComponent]
  }
}
</script>

3.x 更新

在 3.x 中，$children property 已移除，不再支持。如果你需要访问子组件实例，我们建议使用 $refs。