ref属性
- 被用来给元素或子组件
注册引用信息
(id的替代者) - 应用在html标签上获取的是
真实DOM元素
,应用在组件标签上是组件实例对象(vc)
- 使用方式:
- 打标识:
<h1 ref="xxx">...</h1>
或<School ref="xxx"></School>
- 获取:
this.$refs.xxx
- 打标识:
<template>
<div>
<h1 ref="title">获取标题dom元素</h1>
<School ref="sch"></School>
<button @click="show">点我输出上方DOM元素</button>
</div>
</template>
<script>
// 引入组件
import School from './components/School.vue'
export default {
name: 'App',
// 注册组件
components: {
School,
},
methods: {
show() {
console.log(this.$refs.title);
console.log(this.$refs.sch);
}
},
}
</script>
<style scoped>
</style>