当前位置： 首页 > news >正文

11.（vue3.x+vite）组件间通信方式之ref与$parent、$children

news 2026/2/11 2:33:29

前端技术社区总目录（订阅之前请先查看该博客）

示例效果

在这里插入图片描述

注：
（1）ref 加在标签（div等）上，是拿到dom 对象
（2）ref加上组件上，拿到的是组件的引用
（3）让父组件获取子组件的数据或者方法需要通过defineExpose对外暴露，另外让父组件获取子组件的数据或者方法需要通过defineExpose方法对外暴露。因为vue3中组件内部的数据对外“关闭的”，外部不能访问。
（4）$children在vue3已不再使用

父组件代码：

<template><div><div

相关文章：

11.（vue3.x+vite）组件间通信方式之ref与$parent、$children

前端技术社区总目录（订阅之前请先查看该博客） 示例效果 注： （1）ref 加在标签（div等）上，是拿到dom 对象 （2）ref加上组件上，拿到的是组件的引用 （3）让父组件获取子组件的数据或者方法需要通过defineExpose对外暴露，另外让父组件获取子组件的数据或者方法需要通过d…...

编程日记 2023/11/12 0:46:31

[工业自动化-12]：西门子S7-15xxx编程 - PLC从站 - ET200 SP系列详解

目录 一、概述 1.1 概述 二、系统组成 2.1 概述 2.2 与主站的通信接口模块 2.3 总线适配器 2.4 基座单元 2.5 电子模块 2.6 服务器模块 一、概述 1.1 概述 PLC ET200 SP 是西门子&#xff08;Siemens&#xff09;公司生产的一款模块化可编程逻辑控制器&#xff08;PL…...

编程日记 2023/11/12 0:44:29

消息队列简介

消息队列 在认识rabbitMQ之前&#xff0c;我们需要先认识下消息队列。 消息队列&#xff0c;一般简称为MQ&#xff08;Message Queue&#xff09;。先不管消息(Message)这个词&#xff0c;先看看队列(Queue)。 队列就是一种先进先出的数据结构。 所以消息队列可以简单理解为&a…...

编程日记 2023/11/12 0:42:26

SQL中实现汉字的拼音首字母查询

由于汉语拼音首字母也就23个&#xff0c;该方法利用汉字字符按拼音字母排序的特点来生成对应的拼单首字母&#xff0c;只需找到这23个汉语拼音首字母中分别排序在第一的汉字生成23条临时表数据用于参照&#xff0c;即可简单实现汉字匹配拼音首字母 CREATE FUNCTION f_GetPyAcr…...

编程日记 2023/11/12 0:41:25

今天知道LiveData的ktx是真的香

主要还是认知问题&#xff0c;Android 官网从一开始就在推ktx&#xff0c;现在都已经2. 版本了&#xff0c;但是呢&#xff0c;因为之前没有从0开始写过一个Kotlin的APP&#xff0c;就陷入了一个JAVA 思维&#xff0c;在JAVA 中我们知道要做到像协程这么处理不是不能&#xff0…...

编程日记 2023/11/12 0:40:24

SpringBoot中的桥接模式

桥接模式是一种结构型设计模式&#xff0c;它的主要目的是通过将抽象部分与实现部分分离&#xff0c;提高系统的灵活性和可扩展性。在桥接模式中&#xff0c;有四个主要参与者&#xff1a;抽象类、具体抽象类、桥接类和具体类。 抽象类是定义了抽象方法的基类&#xff0c;这些…...

编程日记 2023/11/12 0:38:22

AI爆文变现脚本：易用且免费的自动写作脚本更新了

之前给大家分享的AI爆文变现写作脚本 由于时间仓促&#xff0c;加上我对很多东西不熟悉 免费版本对新手小白来说&#xff0c;安装部署起来是非常的困难 于是这几天我加班加点把整个软件的部署简化 现在无需复杂的环境配置安装&#xff0c;下载配置下就可以使用了。 免费版…...

编程日记 2023/11/12 0:37:21

代码随想录算法训练营Day 49 || 123.买卖股票的最佳时机III 、188.买卖股票的最佳时机IV

123.买卖股票的最佳时机III 力扣题目链接(opens new window) 给定一个数组&#xff0c;它的第 i 个元素是一支给定的股票在第 i 天的价格。 设计一个算法来计算你所能获取的最大利润。你最多可以完成 两笔 交易。 注意&#xff1a;你不能同时参与多笔交易&#xff08;你必须…...

编程日记 2023/11/12 0:36:19

threejs(11)-精通着色器编程（难点）2

一、shader着色器编写高级图案 小日本国旗 precision lowp float; varying vec2 vUv; float strength step(0.5,distance(vUv,vec2(0.5))0.25) ; gl_FragColor vec4(strength,strength,strength,strength);绘制圆 precision lowp float; varying vec2 vUv; float strength 1…...

编程日记 2023/11/12 0:35:19

配置cuda和cudnn出现 libcudnn.so.8 is not a symbolic link问题

cuda版本为11.2 问题如图所示&#xff1a; 解决办法&#xff1a; sudo ln -sf /usr/local/cuda-11.2/targets/x86_64-linux/lib/libcudnn_adv_train.so.8.1.1 /usr/local/cuda-11.2/targets/x86_64-linux/lib/libcudnn_adv_train.so.8 sudo ln -sf /usr/local/cuda-11.2/targ…...

编程日记 2023/11/12 0:32:14

“目标值排列匹配“和“背包组合问题“的区别和leetcode例题详解

1 目标值排列匹配 1.1 从目标字符串的角度来看&#xff0c;LC139是一个排列问题&#xff0c;因为最终目标子串的各个字符的顺序是固定的&#xff1f; 当我们从目标字符串 s 的角度来看 LC139 “单词拆分” 问题&#xff0c;确实可以认为它涉及到排列的概念&#xff0c;但这种…...

编程日记 2023/11/12 0:31:13

火星加载WMTS服务

这是正常的加载瓦片 http://192.168.1.23:8008/geoserver/mars3d/gwc/service/wmts?tilematrixEPSG%3A4326%3A7&layermars3d%3Abuffer&style&tilerow46&tilecol197&tilematrixsetEPSG%3A4326&formatimage%2Fpng&serviceWMTS&version1.0.0&…...

编程日记 2023/11/12 0:30:11

为什么要学习去使用云服务器，外网 IP能干什么，MAC使用Termius连接阿里云服务器。保姆级教学

目录 引言 可能有人想问为什么要学习云服务器&#xff1f; &#xff08;获取Linux环境&#xff0c;获得外网IP) 二、安装教程 引言 可能有人想问为什么要学习云服务器&#xff1f; &#xff08;获取Linux环境&#xff0c;获得外网IP) 1.虚拟机&#xff08;下策&#xff09; …...

编程日记 2023/11/12 0:29:10

VS c++多文件编译

前言&#xff1a;记录下我这个菜鸡学习的过程&#xff0c;如有错误恳请指出&#xff0c;不胜感激&#xff01; 1.简单多文件编译调试 文件目录&#xff1a; 编译&#xff1a; -g选项是告诉编译器生成调试信息&#xff0c;这样可以在程序崩溃或出现错误时更容易地进行调试。这…...

编程日记 2023/11/12 0:28:09

JVM关键指标监控(调优)

JVM 99%情况下不需要调优 使用性能更好的垃圾回收器 核心指标 针对单台服务器而言&#xff1a; jvm.gc.time: 每分钟GC耗时在1s以内 500ms以内最佳 jvm.gc.meantime: 每次YGC耗时在100ms以内&#xff0c;50ms以内最佳 jvm.fullgc.count: FGC(老生代垃圾回收)最多几小时1次&…...

编程日记 2023/11/12 0:27:08

【Proteus仿真】【Arduino单片机】LCD1602-IIC液晶显示

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduino单片机控制器&#xff0c;使用PCF8574、LCD1602液晶等。 主要功能&#xff1a; 系统运行后&#xff0c;LCD1602液晶显示各种效果。 二、软件设计 /* 作者&#xff1a;嗨小…...

编程日记 2023/11/12 0:25:04

skynet学习笔记03— 服务

01、API newservice(name, ...)&#xff1a; 阻塞的形势启动一个名为 name 的新服务&#xff0c;待start函数执行完后会返回这个服务的地址。uniqueservice(name, ...)&#xff1a;针对于当前节点&#xff0c;启动一个唯一服务&#xff08;相当于单例&#xff09;&#xff0c;…...

编程日记 2023/11/12 0:23:01

34 Feign最佳实践

2.4.2.抽取方式 将Feign的Client抽取为独立模块&#xff0c;并且把接口有关的POJO、默认的Feign配置都放到这个模块中&#xff0c;提供给所有消费者使用。 例如&#xff0c;将UserClient、User、Feign的默认配置都抽取到一个feign-api包中&#xff0c;所有微服务引用该依赖包…...

编程日记 2023/11/12 0:22:00

软文推广中如何搭建媒体矩阵

媒体矩阵简单理解就是在不同的媒体平台上&#xff0c;根据运营目标和需求&#xff0c;建立起全面系统的媒体布局&#xff0c;进行多平台同步运营。接下来媒介盒子就来和大家聊聊&#xff0c;企业在软文推广过程中为什么需要搭建媒体矩阵&#xff0c;又该如何搭建媒体矩阵。 一、…...

编程日记 2023/11/12 0:20:59

Unity地面交互效果——5、角色足迹的制作

大家好&#xff0c;我是阿赵。   之前几篇文章&#xff0c;已经介绍了地面交互的轨迹做法。包括了法线、曲面细分还有顶点偏移。Shader方面的内容已经说完了&#xff0c;不过之前都是用一个球来模拟轨迹&#xff0c;这次来介绍一下&#xff0c;怎样和角色动作结合&#xff0c…...

编程日记 2023/11/12 0:19:58

高频面试之3Zookeeper

高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个&#xff1f;3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制&#xff08;过半机制&#xff0…...

编程新知 2026/1/25 13:13:20

Qt Http Server模块功能及架构

Qt Http Server 是 Qt 6.0 中引入的一个新模块&#xff0c;它提供了一个轻量级的 HTTP 服务器实现&#xff0c;主要用于构建基于 HTTP 的应用程序和服务。 功能介绍&#xff1a; 主要功能 HTTP服务器功能&#xff1a; 支持 HTTP/1.1 协议 简单的请求/响应处理模型 支持 GET…...

编程新知 2025/10/17 21:16:57

从零实现STL哈希容器：unordered_map/unordered_set封装详解

本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说&#xff0c;直接开始吧&#xff01; 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...

编程新知 2026/1/31 12:47:25

Axios请求超时重发机制

Axios 超时重新请求实现方案 在 Axios 中实现超时重新请求可以通过以下几种方式&#xff1a; 1. 使用拦截器实现自动重试 import axios from axios;// 创建axios实例 const instance axios.create();// 设置超时时间 instance.defaults.timeout 5000;// 最大重试次数 cons…...

编程新知 2025/10/13 2:26:14

Spring AI 入门：Java 开发者的生成式 AI 实践之路

一、Spring AI 简介 在人工智能技术快速迭代的今天&#xff0c;Spring AI 作为 Spring 生态系统的新生力量&#xff0c;正在成为 Java 开发者拥抱生成式 AI 的最佳选择。该框架通过模块化设计实现了与主流 AI 服务&#xff08;如 OpenAI、Anthropic&#xff09;的无缝对接&…...

编程新知 2025/12/25 18:03:56

k8s业务程序联调工具-KtConnect

概述 原理 工具作用是建立了一个从本地到集群的单向VPN&#xff0c;根据VPN原理&#xff0c;打通两个内网必然需要借助一个公共中继节点&#xff0c;ktconnect工具巧妙的利用k8s原生的portforward能力&#xff0c;简化了建立连接的过程&#xff0c;apiserver间接起到了中继节…...

编程新知 2026/2/1 4:14:14

css3笔记 （1） 自用

outline: none 用于移除元素获得焦点时默认的轮廓线 broder:0 用于移除边框 font-size&#xff1a;0 用于设置字体不显示 list-style: none 消除<li> 标签默认样式 margin: xx auto 版心居中 width:100% 通栏 vertical-align 作用于行内元素 / 表格单元格&#xff…...

编程新知 2025/10/11 5:18:43

大语言模型（LLM）中的KV缓存压缩与动态稀疏注意力机制设计

随着大语言模型&#xff08;LLM&#xff09;参数规模的增长&#xff0c;推理阶段的内存占用和计算复杂度成为核心挑战。传统注意力机制的计算复杂度随序列长度呈二次方增长&#xff0c;而KV缓存的内存消耗可能高达数十GB&#xff08;例如Llama2-7B处理100K token时需50GB内存&a…...

编程新知 2026/1/28 1:40:03

在Ubuntu24上采用Wine打开SourceInsight

1. 安装wine sudo apt install wine 2. 安装32位库支持，SourceInsight是32位程序 sudo dpkg --add-architecture i386 sudo apt update sudo apt install wine32:i386 3. 验证安装 wine --version 4. 安装必要的字体和库（解决显示问题） sudo apt install fonts-wqy…...

编程新知 2025/10/14 0:47:25

浪潮交换机配置track检测实现高速公路收费网络主备切换NQA

浪潮交换机track配置 项目背景高速网络拓扑网络情况分析通信线路收费网络路由 收费汇聚交换机相应配置收费汇聚track配置 项目背景 在实施省内一条高速公路时遇到的需求&#xff0c;本次涉及的主要是收费汇聚交换机的配置&#xff0c;浪潮网络设备在高速项目很少&#xff0c;通…...

编程新知 2026/2/6 13:10:51