vue中ref属性

最新推荐文章于 2024-07-29 14:26:01 发布

顽强的小豆子

最新推荐文章于 2024-07-29 14:26:01 发布

阅读量653

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qiuyushuofeng/article/details/122831249

版权

作用：

获取原生js中的的dom元素（标签元素）或者vue中的组件元素。

与原生js属性用法比较：

1）该属性对应原生javascript中的id和class属性

//通过class或id查找元素
doucument.getElementByClass("school")
document.getElementById("school");
//通过class或id查找标签元素
document.queryElement(".school")
cocument.queryElement("#school")

2）vue中的ref属性

<template>
  <div id="app">
    <button ref = "but">按钮</button>
    <School ref = "sch"/>
    <span ref = "hi">你好啊</span>
  </div>
</template>
<script>
//查找vue代码中的原生js标签或vue组件
this.$refs
</script>