this.$refs
时间: 2023-09-10 17:11:10 浏览: 130
Vue 2.0学习笔记之使用$refs访问Vue中的DOM
this.$refs 是 Vue.js 框架中的一个属性,用于在组件中引用子组件或者DOM元素。通过 this.$refs 可以访问子组件的实例或者操作DOM元素。
例如,在一个父组件中有一个子组件 <ChildComponent>,可以通过给子组件添加 ref 属性来引用它:
```
<template>
<div>
<ChildComponent ref="childRef"></ChildComponent>
</div>
</template>
<script>
import ChildComponent from '@/components/ChildComponent.vue';
export default {
mounted() {
// 通过 this.$refs.childRef 访问子组件实例
console.log(this.$refs.childRef);
// 通过 this.$refs.childRef.$el 访问子组件的 DOM 元素
console.log(this.$refs.childRef.$el);
},
components: {
ChildComponent
}
}
</script>
```
这样,就可以在父组件中通过 this.$refs.childRef 来访问子组件的实例或者 this.$refs.childRef.$el 来访问子组件的 DOM 元素。
阅读全文