vue中$refs
有什么用,下面编程教程网小编给大家介绍一下$refs
的基本介绍及语法介绍!
$refs的基本用法
1、ref 加在普通的元素上,用this.$refs.(ref值) 获取到的是dom元素
2、ref 加在子组件上,用this.$refs.(ref值) 获取到的是组件实例,可以使用组件的所有方法。在使用方法的时候直接this.$refs.(ref值).方法() 就可以使用了。
3、如何利用 v-for 和 ref 获取一组数组或者dom 节点(:ref =某变量)
$refs的语法用法
<hello ref="app"></hello>
console.log(this.$refs.app.innerText);
this.$refs.app.style.color = 'yellow';
console.log(this.$refs.app.msg);// 获取组件数据
console.log(this.$refs.app.test);// 获取组件的方法
以上是编程学习网小编为您介绍的“vue中$refs的基本介绍及语法介绍”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue中$refs的基本介绍及语法介绍


基础教程推荐
猜你喜欢
- 如何用Vue实现一个拖拽式可视化编辑器 2025-01-16
- Vue使用回车登录的时候报 Uncaught TypeError: Cannot read properties of undefined (reading 'validate') 2022-06-22
- css3语法flex的三个属性:flex-grow、flex-shrink、flex-basis介绍 2024-12-14
- vue如何禁用ios页面滑动避免小黑框的出现 2025-01-15
- layui table 表格模板按钮实例 2022-12-13
- 【vue】三种获取input值的写法 2023-10-08
- html菜单和课程表 2023-10-29
- 实现css文字垂直居中的8种方法 2022-11-13
- vue中关于slot插槽的使用方法 2025-01-15
- Vue开发中如何实现跨组件通信 2025-01-16