vue基本使用--refs获取组件或元素
来源:互联网 发布:大数据解决方案公司 编辑:程序博客网 时间:2024/06/05 21:12
- 说明:vm.$refs 一个对象,持有已注册过 ref 的所有子组件(或HTML元素)
- 使用:在 HTML元素 中,添加ref属性,然后在JS中通过vm.$refs.属性来获取
- 注意:如果获取的是一个子组件,那么通过ref就能获取到子组件中的data和methods
添加ref属性
<div id="app"> <h1 ref="h1Ele">这是H1</h1> <hello ref="ho"></hello> <button @click="getref">获取H1元素</button> </div>
获取注册过 ref 的所有组件或元素
methods: { getref() { // 表示从 $refs对象 中, 获取 ref 属性值为: h1ele DOM元素或组件 console.log(this.$refs.h1Ele.innerText); this.$refs.h1ele.style.color = 'red';// 修改html样式 console.log(this.$refs.ho.msg);// 获取组件数据 console.log(this.$refs.ho.test);// 获取组件的方法 } }
阅读全文
0 0
- vue基本使用--refs获取组件或元素
- vue组件($children,$refs,$parent)的使用
- vue组件($children,$refs,$parent)的使用
- Vue—用$refs获取DOM元素+导出Excel
- Vue $refs的基本用法
- Vue $refs的基本用法
- vue $refs的基本用法
- vue $refs的基本用法
- Vue之ref与refs的使用
- vue基础--组件的基本使用
- Vue $emit $refs子父组件间方法的调用
- vue 父子组件通讯--props,refs(muse-ui,vue.js2.0)
- Vue.js之$refs
- vue-ref-$refs用法
- vue component 组件使用
- Vue中使用组件
- vue组件使用
- vue组件使用
- 备案图标网站位置调整
- 时间复杂度与空间复杂度
- date1208关于ATM项目评审
- Cannot set the value of read-only property 'outputFile' for ApkVariantOutputImpl_Decorated
- 欢迎使用CSDN-markdown编辑器
- vue基本使用--refs获取组件或元素
- 实现二分查找算法的递归及非递归
- C++ STL之vector用法总结
- 【Scikit-Learn 中文文档】最近邻
- Nginx的配置-基础配置项
- 缺少jstl-1.2jar 引起的jsp页面错误
- Linux权限管理
- Java IO流操作汇总: inputStream 和 outputStream
- ICE ZEROC文档翻译 (-)