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

defineExpose 显式导出子组件方法

当父组件调用子组件的script setup中的方法时,必须显式导出该方法。因为 script setup 中定义的变量和方法默认是局部的,只有显式导出后,父组件才能访问这些方法。

//父组件-Parent
<template><el-button type="primary" @click="addOrUpdateHandle()">{{ $i18("add") }}</el-button><!-- 弹窗, 新增 / 修改 --><add-or-update ref="addOrUpdateRef"></add-or-update>
</template>
<script setup>
import { unref } from "vue";
const addOrUpdateHandle = (row) => {const instance = unref(addOrUpdateRef);if (instance && typeof instance.init === "function") {instance.init(row);}
};
</script>
//子组件-Child
<template><el-dialogv-model="visible"></el-dialog>
</template>
<script setup>
import { reactive } from "vue";
const state = reactive({visible: false,
});
const init = () => {state.visible = true;
};
// 使用 defineExpose 导出 init 方法
defineExpose({init,
});
</script>

相关文章:

defineExpose 显式导出子组件方法

当父组件调用子组件的script setup中的方法时&#xff0c;必须显式导出该方法。因为 script setup 中定义的变量和方法默认是局部的&#xff0c;只有显式导出后&#xff0c;父组件才能访问这些方法。 //父组件-Parent <template><el-button type"primary" …...

vue 解决列表界面进入明细返回查询条件不变

在Vue中&#xff0c;如果你遇到了列表界面进入详情页面后返回查询条件不变的问题&#xff0c;可能是因为你没有正确地管理状态或者是使用了不合适的组件间通信方式。 解决方案通常涉及到以下几点&#xff1a; 使用Vuex来管理状态&#xff0c;确保查询条件保存在全局状态树中&…...

华为NAT ALG技术的实现

双向NAT技术&#xff1a;经过防火墙的2报文源IP地址和目的IP地址都同时被转换&#xff0c;外网发送报文给内网服务器&#xff0c;先转换目的IP地址&#xff0c;然后符合安全策略后&#xff0c;在替换源IP地址&#xff0c;然后将记录写入防火墙会话表&#xff0c;并发送出报文&a…...

【移植】轻量系统STM32F407芯片移植案例

往期知识点记录&#xff1a; 鸿蒙&#xff08;HarmonyOS&#xff09;应用层开发&#xff08;北向&#xff09;知识点汇总 鸿蒙&#xff08;OpenHarmony&#xff09;南向开发保姆级知识点汇总~ 持续更新中…… 介绍基于 STM32F407IGT6 芯片在拓维信息 Niobe407 开发板上移植 Op…...

k8s 修炼手册

deployment apiVersion: apps/v1 kind: Deployment metadata:name: hello-deploy spec:replicas: 10selector:matchLabels:app: hello-world # Pod的label # 这个Label与Service的Label筛选器是匹配的revisionHistoryLimit: 5progressDeadlineSeconds: 300minReadySeconds: 10…...

重回1899元,小米这新机太猛了

如果不出意外&#xff0c;距离高通年度旗舰骁龙 8 Gen4 发布还剩下不到一个月时间。 对于以小米 15 为首即将到来的下半年各家旗舰机型厮杀画面&#xff0c;讲道理小忆早已是备好瓜子儿摆上果盘翘首以盼了。 不过在这之前&#xff0c;中端主流选手们表示有话要说&#xff1a;为…...

jmeter本身常用性能优化方法

一、常用配置&#xff1a; 修改Jmeter.bat文件&#xff0c;调整JVM参数(修改jmeter本身的最小最大堆内存)&#xff0c;默认都是1个G set HEAP-Xms5g -Xmx5g -XX:MaxMetaspaceSize256m我的本机内存是8G&#xff0c;那最大可以设置870%(本机内存的70%) 这里我设置的5g 如果有…...

Vue3中el-table组件实现分页,多选以及回显

el-table组件实现分页&#xff0c;多选以及回显 需求思路1、实现分页多选并保存上一页的选择2、记录当前选择的数据3、默认数据的回显 完整代码 需求 使用 dialog 显示 table&#xff0c;同时关闭时销毁el-table 表格多选回显已选择的表格数据&#xff0c;分页来回切换依然正确…...

柯桥韩语学校|韩语每日一词打卡:회갑연[회가변]【名词】花甲宴

今日一词:회갑연 韩语每日一词打卡&#xff1a;회갑연[회가변]【名词】花甲宴 原文:인구 노령화에 따라서 요즘 회갑연보다는 고희연을 더 많이 지냅니다. 意思&#xff1a;随着人口老龄化&#xff0c;最近比起花甲宴&#xff0c;更多人办古稀宴。 【原文分解】 1、인구[인구]…...

python概述

目录 python语言的特点 python语言的优点&#xff1a; python语言的缺点&#xff1a; 1.常用的python编辑器 PyCharm Jupyter Notebook VScode 模块的安装、导入与使用 安装 导入与使用 python语言的特点 1.简洁 2.语法优美 3.简单易学 4.开源&#xff1a;用户可自…...

使用celery+Redis+flask-mail发送邮箱验证码

Celery是一个分布式任务队列&#xff0c;它可以让你异步处理任务&#xff0c;例如发送邮件、图片处理、数据分析等。 在项目中和celery 有关系的文件如下&#xff1a; task.py : 创建celery.py 对象&#xff0c;并且添加任务&#xff0c;和app绑定&#xff0c;注意&#xff1…...

【第十四章:Sentosa_DSML社区版-机器学习之时间序列】

目录 【第十四章&#xff1a;Sentosa_DSML社区版-机器学习时间序列】 14.1 ARIMAX 14.2 ARIMA 14.3 HoltWinters 14.4 一次指数平滑预测 14.5 二次指数平滑预测 【第十四章&#xff1a;Sentosa_DSML社区版-机器学习时间序列】 14.1 ARIMAX 1.算子介绍 考虑其他序列对一…...

Vue3.X + SpringBoot小程序 | AI大模型项目 | 饮食陪伴官

gitee平台源码 github平台源码 饮食陪伴师是一个管理饮食的原生大模型小程序&#xff0c;优势&#xff1a; 精确营养监控&#xff1a;用户记录饮食后&#xff0c;我们会计算出食用的营养成分与分量&#xff0c;并反馈给用户。饮食建议有效&#xff1a;大模型经过我们训练具备大…...

【C++】检测TCP链接超时——时间轮组件设计

目录 引言 时间轮思想 设计的核心思路 完整代码 组件接口 个人主页&#xff1a;东洛的克莱斯韦克-CSDN博客 引言 对于高并发的服务器来说&#xff0c;链接是一种比较珍贵的资源&#xff0c;对不活跃的链接应该及时释放。判断连接是否活跃的策略是——在给定的时间内&#…...

中国新媒体联盟与中运律师事务所 建立战略合作伙伴关系

2024年9月27日&#xff0c;中国新媒体联盟与中运律师事务所举行战略合作协议签字仪式。中国新媒体联盟主任兼中国社会新闻网主编、中法新闻法制网运营中心主任左新发&#xff0c;中运律师事务所高级顾问刘学伟代表双方单位签字。 中国新媒体联盟是由央视微电影中文频道联合多家…...

【ArcGIS微课1000例】0121:面状数据共享边的修改方法

文章目录 一、共享边概述二、快速的修改办法1. 整形共享边2. 修改边3. 概化边缘一、共享边概述 面状数据共享边指的是两个或多个面状数据(如多边形)共同拥有的边界。在地理信息系统(GIS)、三维建模、大数据分析等领域,面状数据共享边是描述面状空间数据拓扑关系的重要组成…...

图论(dfs系列) 9/27

一、二维网格图中探测环 题意: 给定一个二维数组grid,如果二维数组中存在一个环&#xff0c;处于环上的值都是相同的。返回true&#xff1b;如果不存在就返回false&#xff1b; 思路&#xff1a; 在以往的dfs搜索中&#xff0c;都是往四个方向去dfs&#xff1b;但是在这一道…...

如何在Windows上安装Docker

在 Windows 上使用 Docker 有两种主要方式&#xff1a;通过 Docker Desktop 安装并使用 WSL 2 作为后端&#xff0c;或者直接在 WSL 2 中安装 Docker。这里推荐手残党直接用图形界面安装到WSL 2的后端&#xff1a; 一、启用Hyper-V和容器特性 1. 右键Windows点击应用和功能 …...

golang格式化输入输出

fmt包使用类似于C的printf和scanf的函数实现格式化I/O 1输出格式化 一般的&#xff1a; 动词效果解释%v[1 -23 3]、[1 -23 3]、&{sdlkjf 23}以默认格式显示的值&#xff0c;与bool&#xff08;%t&#xff09;、int, int8 etc&#xff08;%d&#xff09;、uint, uint8 et…...

Jenkins基于tag的构建

文章目录 Jenkins参数化构建设置设置gitlab tag在工程中维护构建的版本按指定tag的版本启动服务 Jenkins参数化构建设置 选择参数化构建&#xff1a; 在gradle构建之前&#xff0c;增加执行shell的步骤&#xff1a; 把新增的shell框挪到gradle构建之前&#xff0c; 最后保存 …...

华为云AI开发平台ModelArts

华为云ModelArts&#xff1a;重塑AI开发流程的“智能引擎”与“创新加速器”&#xff01; 在人工智能浪潮席卷全球的2025年&#xff0c;企业拥抱AI的意愿空前高涨&#xff0c;但技术门槛高、流程复杂、资源投入巨大的现实&#xff0c;却让许多创新构想止步于实验室。数据科学家…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

&#x1f31f; 什么是 MCP&#xff1f; 模型控制协议 (MCP) 是一种创新的协议&#xff0c;旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议&#xff0c;它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

微信小程序 - 手机震动

一、界面 <button type"primary" bindtap"shortVibrate">短震动</button> <button type"primary" bindtap"longVibrate">长震动</button> 二、js逻辑代码 注&#xff1a;文档 https://developers.weixin.qq…...

高危文件识别的常用算法:原理、应用与企业场景

高危文件识别的常用算法&#xff1a;原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件&#xff0c;如包含恶意代码、敏感数据或欺诈内容的文档&#xff0c;在企业协同办公环境中&#xff08;如Teams、Google Workspace&#xff09;尤为重要。结合大模型技术&…...

学习STC51单片机32(芯片为STC89C52RCRC)OLED显示屏2

每日一言 今天的每一份坚持&#xff0c;都是在为未来积攒底气。 案例&#xff1a;OLED显示一个A 这边观察到一个点&#xff0c;怎么雪花了就是都是乱七八糟的占满了屏幕。。 解释 &#xff1a; 如果代码里信号切换太快&#xff08;比如 SDA 刚变&#xff0c;SCL 立刻变&#…...

Ubuntu Cursor升级成v1.0

0. 当前版本低 使用当前 Cursor v0.50时 GitHub Copilot Chat 打不开&#xff0c;快捷键也不好用&#xff0c;当看到 Cursor 升级后&#xff0c;还是蛮高兴的 1. 下载 Cursor 下载地址&#xff1a;https://www.cursor.com/cn/downloads 点击下载 Linux (x64) &#xff0c;…...

负载均衡器》》LVS、Nginx、HAproxy 区别

虚拟主机 先4&#xff0c;后7...

表单设计器拖拽对象时添加属性

背景&#xff1a;因为项目需要。自写设计器。遇到的坑在此记录 使用的拖拽组件时vuedraggable。下面放上局部示例截图。 坑1。draggable标签在拖拽时可以获取到被拖拽的对象属性定义 要使用 :clone, 而不是clone。我想应该是因为draggable标签比较特。另外在使用**:clone时要将…...

CentOS 7.9安装Nginx1.24.0时报 checking for LuaJIT 2.x ... not found

Nginx1.24编译时&#xff0c;报LuaJIT2.x错误&#xff0c; configuring additional modules adding module in /www/server/nginx/src/ngx_devel_kit ngx_devel_kit was configured adding module in /www/server/nginx/src/lua_nginx_module checking for LuaJIT 2.x ... not…...