Vue-ref用法

2023-11-14

用ref操作模版中的dom元素

1.在模版中,声明ref名称

<div ref="chagneBack" @click='change'> ref引用Dom节点 </div>

2.用法

change(){
      this.$refs.chagneBack.style.color="red"
    },

用ref操作组件

1.在组件引用中声明ref名称

<Left ref="doaction"></Left>

2.在方法中,可以用this.$refs.doaction.来操作子组件中的方法和变量

用ref遇到的问题

当用ref获取dom元素时,必须要等页面有这个元素,如果需要等待页面

this.$nextTick(()=>{
        this.$refs.iptfocus.focus()
      })

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue-ref用法 的相关文章

随机推荐

  • 用C语言编写Windows服务程序的五个步骤

    翻译文档 本文适合初级读者 已阅读20305次 文档 代码 工具 用 C 语言编写 Windows 服务程序的五个步骤 原文 Yevgeny Menaker 翻译 Northtibet 下载源代码原文出处 Five Steps to Wri
  • Linux的命令

    Linux的命令分为四个类型 文件操作命令 系统操作命令 文本处理命令和网络操作命令 下面简单介绍一下常用的Linux命令 文件操作命令 ls 列出目录下的所有文件和目录 cd 切换当前目录 mkdir 创建一个新目录 touch 创建新文
  • (下)苹果有开源,但又怎样呢?

    一开始 因为 MacOS X 苹果与 FreeBSD 过往从密 不仅挖来 FreeBSD 创始人 Jordan Hubbard 更是在此基础上开源了 Darwin 但是 苹果并没有给予 Darwin 太多关注 作为苹果的首个开源项目 它算不
  • OpenCV---膨胀与腐蚀

    膨胀 腐蚀 一 膨胀实现dilate import cv2 as cv import numpy as np def dilate demo image 膨胀 print image shape gray cv cvtColor image
  • 【计算机网络系列】物理层①:物理层的基本概念以及数据通信的基础知识

    本文主要介绍物理层的基本概念以及数据通信的基础知识 同时简单谈谈物理层下面的传输媒体 一 物理层基本概念 首先要强调指出 物理层考虑的是怎样才能在连接各种计算机的传输媒体上传输数据比特流 而不是指具体的传输媒体 大家知道 现有的计算机网络中
  • AI,正在疯狂进化,金融大模型来了

    大家好 现在开源社区 更新速度最快的就是 AI 相关的项目了 几天不看 就又多了一些非常优秀的项目 一 FinGPT 之前我就发过各个领域的大语言模型 比如医学领域的 Huatuo LLaMA 也发过法律领域的大语言模型 LaWGPT 现在
  • 解决Windows丢失msvcp120.dll问题

    其实很多用户玩单机游戏或者安装软件的时候就出现过这种问题 如果是新手第一时间会认为是软件或游戏出错了 其实并不是这样 其主要原因就是你电脑系统的该dll文件丢失了或者损坏了 这时你只需下载这个msvcp120 dll文件进行安装 前提是找到
  • 软件结构化设计-架构真题(二十七)

    2019年 进程P有8个页面 页号分别为0 7 状态位等于1和0分别表示在内存和不在内部才能 假设系统给P分配4个存储块 如果进程P要访问页面6不在内存 那么应该淘汰号是多少 答案 页号2 解析 页号1 2 5 7在内部内存里 而2的被访问
  • Mmdetection训练笔记

    1 imgs per gpu表示一块gpu训练的图片数量 imgs per gpu的值会影响终端输出的显示 比如 如果你有一块GPU 训练集有4000张 imgs per gpu设为2的话 终端的输出可能是Epoch 1 50 2000 另
  • 从Vue2到Vue3【五】——新的组件(Fragment、Teleport、Suspense)

    系列文章目录 内容 链接 从Vue2到Vue3 零 Vue3简介 从Vue2到Vue3 一 Composition API 第一章 从Vue2到Vue3 二 Composition API 第二章 从Vue2到Vue3 三 Composit
  • 前端缓存区别记录 SessionStorage和LocalStorage详解

    LocalStorage和SessionStorage之间的主要区别在于浏览器窗口和选项卡之间的数据共享方式不同 LocalStorage可跨浏览器窗口和选项卡间共享 就是说如果在多个选项卡和窗口中打开了一个应用程序 而一旦在其中一个选项卡
  • spi个人笔记

    spi是全双工通讯 收发同时进行 这句话怎么理解 如上图所示 主机产生一组时钟信号 并通过mosi输出8位数据 这个时候 虽然从机没有返回数据 持续低电平 但是因为是 收发同步 所以此时主机已经采集了此次的miso数据 就是说 无论你的目的
  • 【upload-labs 第四关通关攻略】

    一 类型 无法上传php等多种类型 选择 htaccess配置文件 二 htaccess内容 注意 不能命名 就叫 htaccess
  • Java手写数组和案例拓展

    Java手写数组和案例拓展 1 Mermanid代码绘制的思维导图解释实现思路原理 mermaid svg HoH3kyfEhPDhcUh4 font family trebuchet ms verdana arial sans serif
  • js发布——订阅模式的通用实现及取消订阅

    h1 发布 订阅模式的通用实现 h1 p javaScript作为一门解释执行的语言 给对象添加动态职责是理所当然的 所以我们将发布 订阅的功能提取出来 放在一个单独的对象内 p
  • Javascript创建对象的几种方式及优劣

    1 字面量方式 var obj name tom age 20 career network getName function return this name alert obj getName 这种方式适合创建单个对象 2 创建Obje
  • HttpCanary使用指南——各种神奇的插件

    HttpCanary更多资料 点我 作为目前Android平台最强大的抓包工具 HttpCanary从设计之初就规划了插件功能 2 6 0版本之前称为 模组 基于NetBare框架的虚拟网关 拦截器设计 HttpCanary可以实现非常多的
  • 2020春秋招聘图像处理 人工智能方向 各大厂面试常见题整理一(附答案)(阿里腾讯华为字节)

    因为本人近期也要紧临毕业 面临招聘面试 所以整体别人公开的面经 做一个整理 并且加上自己认为的答案 欢迎各位读者对答案进行指正和交流 深度残差的作用 直观上 深度加深 出现梯度消失和梯度爆炸的问题 在论文中 出现了一个奇怪的现象 就是56层
  • Hive命令的使用

    命令行界面 Command Line Interface CLI 是Hive交互最常见也是最方便的方式 在命令行界面可以执行Hive支持的觉大多数功能 如查询 创建等 hive e 有时 并不需要一直打开命令行界面 也就是说执行完查询后立刻
  • Vue-ref用法

    用ref操作模版中的dom元素 1 在模版中 声明ref名称 div ref引用Dom节点 div 2 用法 change this refs chagneBack style color red 用ref操作组件 1 在组件引用中声明re