ref属性

1、被用来给元素或子组件注册引用信息(id的替代者)

2、应用在html标签上获取的是真实DOM元素;

应用在组件标签上是组件实例对象 vc

3、使用方法:

(1)打标识:<h1 ref="XXX"></h1> 或 <School ref="sch"></School>

(2)获取:this.$refs.XXX

案例:

控制台输出:

Vue ref属性的更多相关文章

  1. Vue ref属性 && props配置项

    1 // # ref属性: 2 // # 1.用来给元素或者子组件注册引用信息(id的替代者) 3 // # 2.应用在html标签上获取的是真实的DOM元素,应用在组件标签上是组件实例对象(vc) ...

  2. Vue.js 源码分析(十) 基础篇 ref属性详解

    ref 被用来给元素或子组件注册引用信息.引用信息将会注册在父组件的 $refs 对象上.如果在普通的 DOM 元素上使用,引用指向的就是 DOM 元素:如果用在子组件上,引用就指向组件实例,例如: ...

  3. Vue使用ref 属性来获取DOM

    注意,在父组件中可以使用this.$refs.属性名  获取任何元素的属性和方法,子组件不可以获取父组件中的 <!DOCTYPE html> <html lang="en& ...

  4. Vue学习之--------脚手架的分析、Ref属性、Props配置(2022/7/28)

    欢迎大家加入我的社区:http://t.csdn.cn/Q52km 社区中不定时发红包 文章目录 1.脚手架的分析 2.ref属性 2.1 基础知识 2.2 代码实现 2.3 测试效果 3.Props ...

  5. vue$ref

    vue的$ref方法 可以在元素上template中直接添加ref属性 类似html的id属性 用来做选项卡的切换的

  6. ref属性

    ref属性 1.被用来给元素或组件注册引用信息(id的替代者) 2.应用在html标签上获取的是真实DOM元素,应用在组件标签上是组件实例对象(vc) 3.使用方式: 打标识:<h1 ref=& ...

  7. 计算属性、侦听属性、局部与全局组件使用、组件通信(父子互传)、ref属性、动态组件和keep-alive、插槽

    今日内容概要 计算属性 侦听属性 局部组件和全局组件 组件通信之父传子 组件通信之子传父 ref属性(组件间通信) 动态组件和keep-alive 插槽 内容详细 1.计算属性 # 插值的普通函数,只 ...

  8. Vue计算属性

    github地址:https://github.com/lily1010/vue_learn/tree/master/lesson06 一 计算属性定位 当一些数据需要根据其它数据变化时,这时候就需要 ...

  9. 在做vue计算属性,v-for处理数组时遇到的一个bug

    bug: You may have an infinite update loop in a component render function 无限循环 需要处理的数组(在 ** ssq **里): ...

  10. spring中ref属性与<ref/>标签

    在bean的内部引用另一个bean对象: 使用ref标签对其进行引用: <ref bean="viewResolver2"/> <bean id="vi ...

随机推荐

  1. python安装过程

    1.在官网下载,点击进入安装包. 2.把Add勾上,会自动配置环境变量. 3,这些是要下载的东西,要全部勾上. 4.这里特别注意路径,把路径改成自己想放的盘里面. 5.配置环境变量,在此电脑搜索 编辑 ...

  2. Service层和Dao层的一些自我理解(╥╯^╰╥)(╥╯^╰╥)(学了这么久,这玩意儿似懂非懂的)

    学习java已经有很长时间了,但由于是在学校学的,基础不怎么扎实. 这几个月系统的学习,弥补了很多的缺陷,虽然大多数时间都在弄算法(咳咳),我前面的博客有写 如果有认真看过我代码的朋友会发现,我其实英 ...

  3. [机器学习] PCA主成分分析原理分析和Matlab实现方法

    转载于http://blog.csdn.net/guyuealian/article/details/68487833 网上关于PCA(主成分分析)原理和分析的博客很多,本博客并不打算长篇大论推论PC ...

  4. [python] python模块graphviz使用入门

    文章目录 1 安装 2 快速入门 2.1 基本用法 2.2 输出图像格式 2.3 图像style设置 2.4 属性 2.5 子图和聚类 3 实例 4 如何进一步使用python graphviz Gr ...

  5. mysql基础命令语法

    删除空格 update 表名 set 字段名 = replace(字段名 ,' ','') ; 临时表创建与删除 -- 创建临时表 create temporary table if not exis ...

  6. MongoDB分片副本集生产环境部署-Windows版本

    title: MongoDB分片副本集生产环境部署(Windows版本) date: 2022-10-29 17:21:11 tags: - 运维 系统架构 配置环境 系统都是windows 10 专 ...

  7. [WPF]DataContext结果不显示

    namespace DataContext_ItemSource_Demo { public class Person { public string Name; } public class Vie ...

  8. 使用IIS配置代理,转发POST和GET访问,配置IIS接口转发失效问题处理

    先说一下可能引发配置失败的原因:大概率是你的Application Request Routing没有配置好,或者你的正则表达没有搞好,往下看步骤自己对照哇~ 1.确保服务器已经安装IIS 2.下载U ...

  9. 【分析笔记】SiliconLabs EFR32BG22 Bluetooth Mesh SensorClient 源码分析

    硬件环境: SLTB010A(BRD4184A Rev A02 / EFR32BG22C224F512IM40) 软件环境: SimplicityStudio5/gecko_sdk_3.2.3 分析工 ...

  10. drf-day4——序列化类常用字段和字段参数、序列化类source用法、序列化类定制字段返回内容的两种方式、序列化类的多表关联反序列化保存、反序列化字段校验、ModelSerializer的使用

    目录 一.序列化类常用字段和字段参数(了解) 1.1 常用字段类 1.2 常用字段参数 选项参数: 通用参数: 重点 二.序列化高级用法之source(了解) 2.1 序列化定制字段名字 三.序列化高 ...