关键词搜索

源码搜索 ×
×

Vue ref属性

发布2023-04-14浏览304次

详情内容

Vue ref属性

被用来给元素或子组件注册引用信息(id的替代者)
应用在html标签上获取的是真实DOM元素,应用在组件标签上是组件实例对象(vc)

<template>
  <div>
	<h1 v-text="msg" ref="title"></h1>
	<button ref="btn" @click="showDOM">点我输出上方的DOM元素</button>
	<School ref="sch"/>
  </div>
</template>

<script>
import School from './components/School'

export default {
  name:'App',
  components:{School},
  data() {
    return {
      msg:"好好学习"
    }
  },
  methods:{
	showDOM(){
		console.log(this.$refs.sch) //真实DOM元素
		console.log(this.$refs.btn) //真实DOM元素
		console.log(this.$refs.sch) //School组件的实例对象
	}
  }
};
</script>
<style>
</style>

    相关技术文章

    点击QQ咨询
    开通会员
    返回顶部
    ×
    微信扫码支付
    微信扫码支付
    确定支付下载
    请使用微信描二维码支付
    ×

    提示信息

    ×

    选择支付方式

    • 微信支付
    • 支付宝付款
    确定支付下载