VUE--- ref refs

ref & refs 的作用:用于获取dom元素或组件实例,也可用于组件组件间数据的获取和修改

ref & refs 与querySelector的区别:

        ● ref & refs 查找的范围是当前组件内,更加精确稳定

        ● querySelector 查找的范围是整个页面

获取dom的使用步骤:

        1、目标标签添加ref属性

<div ref="chartRef">我是渲染图表的容器</div>

        2、通过this.$refs.xxx,获取目标标签

mounted () {console.log(this.$refs.chartRef)
},

获取组件方法的步骤:

         1、给目标组件添加ref属性

<BaseForm ref="baseForm"></BaseForm>

        2、 通过this.$refs.xxx,获取目标组件,就可以调用组件中的方法

this.$refs.baseForm.resetForm()

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/633052.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

docker部署项目,/var/lib/docker/overlay2目录满了如何清理?

docker部署项目&#xff0c;/var/lib/docker/overlay2目录满了如何清理&#xff1f; 一、问题二、解决1、查看 /var/lib/docker 目录&#xff08;1&#xff09;、containers 目录&#xff08;2&#xff09;、volumes 目录&#xff08;3&#xff09;、overlay2 目录 2、清理&…

总结1094

昨天又摆烂了&#xff0c;总结后面补的。 记录一个as中的错误&#xff1a; 一年没碰android了&#xff0c;下载安装AS,发现出现Gradle问题&#xff1a; ERROR: Connection timed out: connect&#xff1a;错误:连接超时:连接 这个错误 一般来说是因为.gradle引起的 搞了半…

Python编辑开发---pycharm pro 2023 中文

PyCharm Pro 2023是一款功能强大的Python集成开发环境&#xff08;IDE&#xff09;&#xff0c;旨在提高Python开发人员的生产力。它提供了智能代码编辑、实时代码分析和调试工具&#xff0c;支持版本控制和数据库工具&#xff0c;以及可扩展的插件系统。PyCharm Pro 2023可在多…

《30天自制操作系统》学习笔记(七)

先体验一下编译仿真方法&#xff1a; 30天自制操作系统光盘代码在下面链接&#xff0c;但是没有编译仿真工具&#xff1a; https://gitee.com/zhanfei3000/30dayMakeOS 仿真工具在下面链接&#xff1a; https://gitee.com/909854136/nask-code-ide 这是一个集成的编译仿真工…

jrebel IDEA 热部署

1 下载 2022.4.1 JRebel and XRebel - IntelliJ IDEs Plugin | Marketplace 2 选择下载好的zip 离线安装IDEA 插件 重启IDEA 3 打开 [Preference -> JRebel & XRebel] 菜单&#xff0c;输入 GUID address 为 https://jrebel.qekang.com/1e67ec1b-122f-4708-87d…

WINCC读写EXCEL-VBS

原创 RENHQ WINCC 关于VBS操作EXCEL的文档不管在论坛上还是在网上&#xff0c;相关的脚本已经很多&#xff0c;但是依然有很多人在问这个问题&#xff0c;于是把我以前在论坛上发的一个集合帖子的脚本拿来&#xff0c;重新开个帖子&#xff0c;如果再有人问的话&#xff0c;可…

使用动态sql时,if标签不起作用

目录 场景&#xff1a; 问题分析&#xff1a; 问题解决&#xff1a; 场景&#xff1a; 简单讲一下应用场景 我拿到一个项目&#xff0c;完成后端数据处理&#xff0c;在进行可选条件查询时&#xff0c;使用动态sql 在mapper.xml中我先是这么写的 <select id"list&…

数学建模--比赛

内容来自数学建模BOOM&#xff1a;【快速入门】北海&#xff1a;数模建模基础MATLAB入门论文写作数学模型与算法(推荐数模美赛国赛小白零基础必看教程)_哔哩哔哩_bilibili 目录 1.学习内容 2.参赛须知 1&#xff09;参赛作品的组成 2)参赛作品的提交 3.软件安装 4.注意…

web蓝桥杯真题--10、灯的颜色变化

介绍 我们经常会看到各种颜色的灯光&#xff0c;本题我们将实现一个颜色会变化的灯的效果。 准备 开始答题前&#xff0c;需要先打开本题的项目代码文件夹&#xff0c;目录结构如下&#xff1a; ├── effect.gif ├── images │ ├── greenlight.svg │ ├── l…

Oracle学习笔记——基础一起学 16

--删除重复记录 --创建student表 create table student(sno number(6) ,sname varchar2(10),sage int); insert into student values(1,AA,21); insert into student values(2,BB,22); insert into student values(3,CC,23); insert into student values(3,CC,34); inse…

部署智能合约到 polygon 上(Web3项目三实战之三)

在上一篇 为 Web3 项目撰写智能合约(Web3项目三实战之二) 中,我们已经为Web3项目编写好了智能合约,而本文将要部署智能合约到 polygon上。 您或许会问,polygon到底是什么?其实它是测试链(也可以说是测试网),由于主链(或主网)部署智能合约是需要gas,而这gas是要花费…

新手入门Java第二阶段 封装概念及包、访问修饰符和static修饰符介绍

第三章 封装 课前回顾 1.带参方法如何定义 访问修饰符 返回值类型 方法名(参数列表){//形式参数列表}对象名.方法名(实参列表);2.方法的参数是如何传递的 在java中&#xff0c;方法参数的传递都是值传递。只是基本数据类型作为参数传递时&#xff0c;传递的是值的拷贝。引用…

移动web开发流式布局

1.0 移动端基础 1.1 浏览器现状 PC端常见浏览器&#xff1a;360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器。 内核&#xff1a; 浏览器内核备注Safariwebkitwebkit内核是苹果公司开发的一款渲染引擎&#xff0c;目前已被很多手机厂商所采…

2024年工业控制系统趋势洞察——影响制造业未来的力量

随着制造业数字化转型不断深入&#xff0c;云计算、大数据等新一代信息技术与工业领域的深度融合&#xff0c;工业控制系统重要性不断提升。2023年2月&#xff0c;中共中央、国务院印发《质量强国建设纲要》&#xff0c;提出支持通用基础软件、工业软件、平台软件、应用软件工程…

UE5 蓝图编辑美化学习

虚幻引擎中干净整洁蓝图的15个提示_哔哩哔哩_bilibili 1.双击线段成节点。 好用&#xff0c;爱用 2.用序列节点 好用&#xff0c;爱用 3.用枚举。 好用&#xff0c;能避免一些的拼写错误 4.对齐节点 两点一水平线 5.节点上下贴节点 &#xff08;以前不懂&#xff0c;现在经常…

Gitlab添加ssh-key报500错误处理

Gitlab添加ssh-key报500错误 一、查看日志 发现Errno::Enoent(No such file or derectory -ssh): rootasu1:/home/caixin# tail -f /var/log/gitlab/gitlab-rails/production.log二、分析 根据日志提示&#xff0c;好像是缺少文件或目录&#xff0c;后面有个ssh,难首是依赖s…

C#winform上位机开发学习笔记1-串口助手的ModbusCRC功能

1.首先自定义CRC校验函数 private UInt16 Crc_Check(byte[] Data, byte DataLEN){UInt16 CRC 0xFFFF;for (byte i 0; i < DataLEN; i){ CRC ^ Data[i];for(byte j 0; j < 8; j){if((CRC & 0x0001) 0x0001){CRC (UInt16)((CRC >> 1) ^ 0xA001);}else{CRC …

SQL 最大连续合格次数 最大连胜记录次数 最大连败记录次数

有这样一个问题&#xff0c;工厂中要统计某个供应商送货检验的情况&#xff0c;依照其连续合格次数&#xff0c;决定是否免检&#xff0c;不使用游标或者循环&#xff0c;如何写这个sql。 此情景也可以用于统计连胜记录等 先要学习一下 窗函数LAG&#xff0c;指的是按分组和排…

leetcode热题100.两数之和

文章目录 题目思路1思路2 题目 给定一个整数数组 nums 和一个整数目标值 target&#xff0c;请你在该数组中找出 和为目标值 target 的那 两个 整数&#xff0c;并返回它们的数组下标。 你可以假设每种输入只会对应一个答案。但是&#xff0c;数组中同一个元素在答案里不能重复…

vue 解决el-table 表体数据发生变化时,未重新渲染问题

效果图父组件中数量改变后总数重新计算 子组件完整代码 <template><el-tableshow-summaryref"multipleTable"v-bind"$props"selection-change"handleSelectionChange"row-click"handleRowClick":summary-method"getSum…