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

Vue｜事件处理

news 文章来源：https://blog.csdn.net/weixin_42794881/article/details/129029931 2025/2/12 10:56:02

事件处理

    • 1. 事件使用
      • 1.1 事件绑定
      • 1.2 事件参数
    • 2. 事件修饰符
      • 2.1 阻止默认事件
      • 2.2 阻止事件冒泡
      • 2.3 事件只允许触发一次
      • 2.4 事件捕获
      • 2.5 操作当前元素
      • 2.6 行为立即执行无需等待回调
    • 3. 键盘事件
    • 4. 本章小结
      • 4.1 事件使用小结
      • 4.2 事件修饰符小结
      • 4.3 键盘事件小结

1. 事件使用

1.1 事件绑定

接上章内容，在project目录创建事件处理文件夹以及3个html文件

在这里插入图片描述
在这里插入图片描述

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>事件处理</title><script src="../js/vue.js" type="text/javascript"></script>
</head>
<body><!-- 准备好一个容器 --><div id="root"><h2>{{name}}</h2></div><script type="text/javascript">//Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。// 创建vue实例const vm = new Vue({el:'#root',//函数式data:function(){return{name:'摔跤猫子',};},});</script>
</body>
</html>

需求1：点击一个弹窗显示摔跤猫子，这是一个很简单的需求，想必大家都能很快实现

在这里插入图片描述

	<!-- 需求1 点击按钮 弹窗摔跤猫子 --><button onclick="alert1()">需求1</button><script>function alert1(){alert('摔跤猫子');}</script>

但我们现在是在vue，所以上述方式不可取，得用vue的方式来实现
第一步：将button中click修改为v-on:click
第二步：在vue实例中增加一个methods并实现对应的响应函数

在这里插入图片描述

<!-- 需求1 点击按钮 弹窗摔跤猫子 -->
<button v-on:click="alert1">需求1</button><script type="text/javascript">Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。// 创建vue实例const vm = new Vue({el:'#root',//函数式data:function(){return{name:'摔跤猫子',};},methods:{alert1(){alert('摔跤猫子');},},});
</script>

事件简写，可以将v-on:替换成一个@符，效果也是一致的

在这里插入图片描述

<!-- 需求1 点击按钮 弹窗摔跤猫子 -->
< v-on:click="alert1">需求1</>
<!-- 需求1简写方式 -->
<button @click="alert1">需求1简写</button>

1.2 事件参数

需求2：点击按钮时传递参数；例如我们在一个数据列表中想要通过点击按钮的操作来查看某条数据时，就必须要通过单个的标识符来查询；可以看到如下图，在需求2的按钮并没有传递参数，但是直接在alert2函数中进行接收并输出也是有数据显示，因为此处的event是vue实例对象

在这里插入图片描述

那如果需要传递页面上的参数该如何操作呢？只需要在函数后增加一个括号并填写数据即可

在这里插入图片描述

<!-- 需求1 点击按钮 参数传递 -->
<button v-on:click="alert2('摔跤猫子')">需求2</button>

那么新的问题又来了，我既想要接收到vue实例，又想接收页面参数呢该如何操作呢？是不是在对应的JS函数中再加一个event就可以呢？

在这里插入图片描述

可以看到答案是否定的，第二个参数输出的是undefined，正确的方式是在html标签中输入$event关键字即可，vue会自动进行解析，同时参数顺序是一一对应的

在这里插入图片描述

<!-- 需求1 点击按钮 参数传递 -->
<button v-on:click="alert2('摔跤猫子',$event)">需求2</button>

2. 事件修饰符

在Vue中，事件修饰符处理了许多DOM事件的细节，让我们不再需要花大量的时间去处理这些烦恼的事情，而能有更多的精力专注于程序的逻辑处理。

修饰符作用
prevent阻止默认事件
stop阻止事件冒泡
once事件只触发一次
capture使用事件的捕获模式
self只有event.target是当前操作的元素时才触发事件
passive事件的默认行为立即执行，无需等待事件回调执行完毕

2.1 阻止默认事件

需求1：阻止默认事件，点击a标签显示弹窗，并阻止a标签的默认行为，不让页面跳转；可以看到如下图，当点击完a标签之后，先弹出弹窗，然后页面会自动跳转，那么就需要通过prevent函数来进行阻止了

在这里插入图片描述

可以看到如下图所示，点击完a标签过后，页面并未跳走，实现方式如下

实现方式代码
通过函数阻止e.preventDefault();
写在click后面@click.prevent

在这里插入图片描述

2.2 阻止事件冒泡

需求2：阻止事件冒泡，避免操作多次；
常见场景：如下图一个商品列表，点击图片或者其他商品信息区域即跳转商品详情，而点击购物车图标时则只做加入购物车操作。

在这里插入图片描述

实现对应的页面布局以及对应的响应函数如下，这里样式简单弄一下只为达到演示效果，注意加入购物车按钮要包含在大容器盒子里。

在这里插入图片描述

这时候如果点击加入购物车按钮，那么两个函数都会响应，可以看到先是弹出的加入购物车，然后又弹出的进入详情

在这里插入图片描述

如何将他们有效的分离从而达到阻止事件冒泡的效果呢，实现方式如下

实现方式代码
通过函数阻止e.stopPropagation();
写在click后面@click.stop

在这里插入图片描述

<!-- 需求2：阻止事件冒泡，避免响应多次 -->
<div @click="alert1" class="div1">商品信息<button @click.stop="alert2">加购</button>
</div>

2.3 事件只允许触发一次

顾名思义，在页面无刷新重新加载的情况下，只允许加载一次；在未使用该修饰符前效果如下图所示，点击一次触发一次

在这里插入图片描述

<!-- 需求3：按钮只触发一次 -->
<button @click="alert1">只让触发一次</button>

如果业务上限制了用户在不刷新页面的前提下只能点击一次该如何处理呢？如下图所示，在无刷新的情况下只触发了一次函数

实现方式代码
写在click后面@click.once

在这里插入图片描述

2.4 事件捕获

可以继续使用需求2的代码来实现案例效果。

在这里插入图片描述
在这里插入图片描述

在现在这种情况下默认是先冒泡再捕获，也就是当点击加购时，是先弹出加购文本然后才是详情

在这里插入图片描述

如果需要使用事件的捕获模式，先捕获，再冒泡，就是达到点击加购时先弹出详情，再弹出加购时则需要使用到如下修饰符

实现方式代码
写在click后面@click.capture

在这里插入图片描述

2.5 操作当前元素

这个修饰符的作用是只有event.target是当前操作的元素时才触发事件，准备代码如下；

在这里插入图片描述
在这里插入图片描述

当点击button按钮时会输出什么呢？它无法定位到当前操作的元素是哪部分，界面上一个div和一个按钮只输出了按钮

在这里插入图片描述

给事件后面增加上self修饰符再试一下，现在点击按钮只会输出按钮的那部分了，只有当点击外部div的时候才会输出相对应的结果

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.6 行为立即执行无需等待回调

事件的默认行为立即执行，无需等待事件回调执行完毕；准备一个div，内容高度需超出外部盒子高度，达到滚动条效果

在这里插入图片描述

<style>*{margin-top:20px;}.content{width:200px;height:200px;background:green;overflow: auto;color:white;}.content div{height: 100px;}
</style>
<div class="content"><div>摔</div><div>跤</div><div>猫</div><div>子</div>
</div>

给外部div添加一个滚动事件并监听，可以使用scroll也可以使用wheel

在这里插入图片描述

给滚动事件增加修饰符达到事件立即执行的效果

实现方式代码
写在click后面@click.passive
<div class="content" @wheel="roll"><div>摔</div><div>跤</div><div>猫</div><div>子</div>
</div>

这样看上去效果并不是很明显，先给函数增加一个十万次的for循环，来看一下使用修饰符之前以及之后的效果；如下图就能直观的看到，没有使用修饰符前需要先等结果输出完才能滚动滚动条，但使用了修饰符后，输出循环的结果以及滚动滚动条两者互不冲突

在这里插入图片描述
在这里插入图片描述

3. 键盘事件

准备一个input文本框，可以分别尝试使用不同的键盘事件；keydowm是你按下按钮,不需要松手抬起即触发，keyup需要你按下去并松手才触发，也可以通过不同的按键修饰符达到特殊的效果

<input placeholder="回车提示所输入的值" @keyup="alertValue" />

在这里插入图片描述

按键别名
回车enter
删除delete
退出esc
空space
换行tab
上up
下down
左left
右right

4. 本章小结

4.1 事件使用小结

使用v-on:click 或 通过简写@xxx 绑定事件，其中xxx是事件名称
事件的回调需要配置在methods对象中，最终会在vm上;
@click="demo”和 @click="demo($event)” 两者效果一致，但后者可以传参;

4.2 事件修饰符小结

prevent：阻止默认事件
stop：阻止事件冒泡
once：事件只触发一次
capture：使用事件的捕获模式
self：只有event.target是当前操作的元素时才触发事件
passive：事件的默认行为立即执行，无需等待事件回调执行完毕，只有当使用wheel事件时才会有这种问题,做移动端开发的时候可能会使用到passive

4.3 键盘事件小结

Vue未提供别名的按键，可以使用按健原始的key值去绑定，但注意要转为kebab-case(短横线命名)
系统修饰键 (用法特殊) : ctr1、alt、shift、meta
(1).配合keyup使用: 按下修饰键的同时，再按下其他键，随后释放其他键，事件才被触发。
(2).配合keydown使用: 正常触发事件
可以使用keyCode去指定具体的按键
Vue.config.keyCodes.自定义键名 = 键码，可以去定制按键别名

相关文章：

Vue｜事件处理

事件处理1. 事件使用1.1 事件绑定1.2 事件参数2. 事件修饰符2.1 阻止默认事件2.2 阻止事件冒泡2.3 事件只允许触发一次2.4 事件捕获2.5 操作当前元素2.6 行为立即执行无需等待回调3. 键盘事件4. 本章小结4.1 事件使用小结4.2 事件修饰符小结4.3 键盘事件小结1. 事件使用 1.1 事…...

编程日记 2023/2/15 7:04:04

css书写方式

目录标题一、css是什么&#xff1f;二、css的书写方式1、行内样式【不推荐使用&#xff0c;太固定】2、页面样式&#xff08;又叫内联样式&#xff09;3、外联样式【店家推荐】4、import与link标签的区别一、css是什么&#xff1f; css(cascade style sheet)是用来装饰和装扮页…...

编程日记 2023/2/15 7:03:00

Python网络爬虫 学习笔记（2）BeaufitulSoup库

文章目录BeautifulSoup库的基本介绍HTML标签的获取和相关属性HTML文档的遍历prettify()方法使用BeautifulSoup库对HTML文件进行内容查找信息的标记的相关概念&#xff08;非重点&#xff09;find_all()方法&#xff08;重点&#xff09;综合实例&#xff1a;爬取软科2022中国大…...

编程日记 2023/2/15 7:01:50

JavaScript------内建对象

一、解构赋值 1、数组的解构 1.1、解构赋值 const arr ["孙悟空", "猪八戒", "沙和尚"];let a, b, c;[a, b, c] arr; // 等同于 [a, b, c] ["孙悟空", "猪八戒", "沙和尚"] 1.2、声明同时解构 let [d, e…...

编程日记 2023/2/15 7:00:43

React + Redux 处理异步请求

redux 处理异步请求 方式一：在 componentDidmount 中直接进⾏请求，在将数据同步到 redux 创建 Store 仓库 import {createStore } from redux;const defaultState = {banners: [] }const reducer =...

编程日记 2023/2/15 6:59:37

揭秘涨薪50%经验：从功能测试到自动化测试，我是如何蜕变的？

本人在今年互联网大环境如此严峻的情况下&#xff0c;作为一个刚毕业不到一年的初级测试&#xff0c;赶在“金三银四”依然拿到了一些面试机会&#xff0c;并且成功拿下4家公司的offer&#xff0c;其中不乏互联网大厂&#xff0c;而且最高总包给到了接近double&#xff08;无炫…...

编程日记 2023/2/15 6:58:30

【论文速递】MMM2020 - 电子科技大学提出一种新颖的局部变换模块提升小样本分割泛化性能

【论文速递】MMM2020 - 电子科技大学提出一种新颖的局部变换模块提升小样本分割泛化性能 【论文原文】&#xff1a;A New Local Transformation Module for Few-shot Segmentation 【作者信息】&#xff1a;Yuwei Yang, Fanman Meng, Hongliang Li, Qingbo Wu,Xiaolong Xu an…...

编程日记 2023/2/15 6:57:20

补充前端面试题（二）

#$set数据变化视图不更新问题, 当在项目中直接设置数组的某一项的值&#xff0c;或者直接设置对象的某个属性值&#xff0c;这个时候&#xff0c;你会发现页面并没有更新。这是因为 Object.defineProperty()限制&#xff0c;监听不到变化。解决方式&#xff1a;this.$set(你要改…...

编程日记 2023/2/15 6:56:16

JavaScript原型、原型链、原型方法

文章目录原型和原型链prototype、 __ proto __ 、constructor原型链原型方法instanceOfhasOwnPropertyObject.create()、new Object()总结原型和原型链 prototype、 __ proto __ 、constructor 首先我们看下面一段代码 // 构造函数Personfunction Person(name, age) {this.na…...

编程日记 2023/2/15 6:55:12

linux篇【14】：网络https协议

目录 一.HTTPS介绍 1.HTTPS 定义 2.HTTP与HTTPS &#xff08;1&#xff09;端口不同&#xff0c;是两套服务 &#xff08;2&#xff09;HTTP效率更高&#xff0c;HTTPS更安全 3.加密&#xff0c;解密&#xff0c;密钥 概念 4.为什么要加密&#xff1f; 5.常见的加密方式…...

编程日记 2023/2/15 6:54:05

1.9实验9：配置虚链路

1.4.4实验9：配置虚链路 实验目的(1） 实现OSPF 虚链路的配置 (2） 描述虚链路的作用 实验拓扑配置虚链路实验拓扑如图1-19所示。[1] 图1-19 配置虚链路 实验步骤...

编程日记 2023/2/15 6:53:00

三次握手-升级详解-注意问题

TCP建立连接的过程就是三次握手&#xff08;Three-way Handshake&#xff09;&#xff0c;在建立连接的过程实际上就是客户端和服务端之间总共发送三个数据包。进行三次握手主要是就是为了确认双方都能接收到数据包和发送数据包&#xff0c;而客户端和服务端都会指定自己的初始…...

编程日记 2023/2/15 6:51:55

软件架构知识3-系统复杂度-高可用性、可扩展性、低成本、安全、规模

高可用性 系统无中断地执行其功能的能力&#xff0c;代表系统的可用性程度&#xff0c;是进行系统设计时的准则之一。 高可用的“冗余”解决方案&#xff0c;单纯从形式上来看&#xff0c;和之前讲的高性能是一样的&#xff0c;都是通过增加更多机 器来达到目的&#xff0c;但…...

编程日记 2023/2/15 6:50:45

SpringCloud学习笔记 - 自定义及解耦降级处理方法 - Sentinel

1. SentinelRecourse配置回顾 通过之前的学习&#xff0c;我们知道SentinelRecourse配置的资源定位可以通过两种方式实现&#xff1a;一种是URL&#xff0c;另一种是资源名称。这两种限流方式都要求资源ID唯一 RestController public class RateLimitController {GetMapping(…...

编程日记 2023/2/15 6:49:40

Redis之搭建一主多从

搭建redis一主多从的过程 1.在相应位置创建一个文件夹存放redis配置文件 mkdir myredis2.复制redis配置文件到此文件夹中 cp /opt/redis/redis/bin/redis.conf /opt/myredis/redis.conf3.新建三个配置文件 touch redis6379.conf touch redis6380.conf touch redis6381.conf4…...

编程日记 2023/2/15 6:48:34

Transformer机制学习笔记

学习自https://www.bilibili.com/video/BV1J441137V6 RNN&#xff0c;CNN网络的缺点 难以平行化处理&#xff0c;比如我们要算b4b^4b4&#xff0c;我们需要一次将a1a^1a1~a4a^4a4依次进行放入网络中进行计算。 于是有人提出用CNN代替RNN 三角形表示输入&#xff0c;b1b^1b1的…...

编程日记 2023/2/15 6:47:22

1、第一个CUDA代码：hello gpu

目录第一个CUDA代码&#xff1a;hello gpu一、__global__ void GPUFunction()二、gpu<<<1,1>>>();三、线程块、线程、网格知识四、核函数中的printf();五、cudaDeviceSynchronize();第一个CUDA代码&#xff1a;hello gpu #include <stdio.h>void cpu(…...

编程日记 2023/2/15 6:46:17

UG二次开发装配篇 添加/拖动/删除组件方法的实现

我们在UG装配的过程中&#xff0c;经常会遇到需要调整组件目录位置&#xff0c;在软件设计过程中可以通过在目录树里面拖动组件来完成。 那么&#xff0c;如果要用程序实现组件的移动/拖动&#xff0c;我们要怎么做呢&#xff1f; 本节就完成了添加/拖动/删除组件方法的实现&…...

编程日记 2023/2/15 6:45:09

【ros bag 包的设计原理、制作、用法汇总】

ros bag 包的设计原理 序列化和反序列化 首先知道Bag包就是为了录制消息，而消息的保存和读取就涉及到一个广义上的问题序列化和反序列化，它基本上无处不在，只是大部分人没有注意到，举个简单的例子，程序运行的时候，是直接操作的内存，也就是一个结构体或者一个对象，但内…...

编程日记 2023/2/15 6:44:01

Linux网络：聚合链路技术

目录 一、聚合链路技术 1、bonding作用 2、Bonding聚合链路工作模式 3、Bonding实现 一、聚合链路技术 1、bonding作用 将多块网卡绑定同一IP地址对外提供服务&#xff0c;可以实现高可用或者负载均衡。直接给两块网卡设置同一IP地址是不可以的。通过 bonding&#xff0c…...

编程日记 2023/2/15 6:42:53

2023年数据安全的下一步是什么？

IT 预算和收入增长领域是每个年度开始时的首要考虑因素&#xff0c;在当前的世界经济状况下更是如此。 IT 部门和数据团队正在寻找确定优先级、维护和构建安全措施的最佳方法&#xff0c;同时又具有成本效益。 这是一个棘手的平衡点&#xff0c;但却是一个重要的平衡点&#…...

编程日记 2023/2/15 6:41:48

在浏览器输入URL后发生了什么？

在浏览器输入URL并获取响应的过程&#xff0c;其实就是浏览器和该url对应的服务器的网络通信过程。从封装的角度来讲&#xff0c;浏览器和web服务器执行以下动作&#xff1a;&#xff08;简单流程&#xff09;1、浏览器先分析超链接中的URL:分析域名是否规范2、浏览器向DNS请求…...

编程日记 2023/2/15 6:40:37

Dubbo学习

0.start 容器container启动&#xff08;spring&#xff09;&#xff0c;初始化我们的服务提供者&#xff08;Provider&#xff09;1.register 把业务层的方法&#xff0c;注册到注册中心&#xff08;Register&#xff09;2.subscribe 消费者&#xff08;Consumer&#xff09;订…...

编程日记 2023/2/15 6:39:31

CMMI-立项管理流程

立项管理&#xff08;Project Initialization Management, PIM&#xff09;的目的是&#xff1a;&#xff08;1&#xff09;采纳符合机构最大利益的立项建议&#xff0c;通过立项管理使该建议成为正式的项目&#xff08;即合法化&#xff09;。&#xff08;2&#xff09;杜绝不…...

编程日记 2023/2/15 6:38:26

看《狂飙》读人生，致敬2023！

作为2023年的第一篇博文&#xff0c;我不想写代码&#xff0c;我想谈谈最近看的《狂飙》&#xff0c;总结了十条哲理&#xff0c;共勉。希望我们的2023&#xff0c;未来的人生会更加出彩。 01 你以为很好的关系&#xff0c;其实也就那么回事。 陈金默以为高启强对他很好&…...

编程日记 2023/2/15 6:37:20

Web自动化测试——Junit5篇

文章目录一、相关依赖注入二、注解调用三、断言 Assert四、规定用例执行顺序五、高效参数化1&#xff09;单参数2&#xff09;多参数3&#xff09;文件获取参数4&#xff09;方法获取数据&#xff08;动态参数&#xff09;六、测试套件整活Junit 是一个面向 Java 语言的单元测试…...

编程日记 2023/2/15 6:36:09

Seata源码学习（二）-源码入口

Seata源码剖析-源码入口 Seata客户端启动 首先一个Seata的客户端启动一般分为几个流程&#xff1a; 自动加载各种Bean及配置信息初始化TM初始化RM&#xff08;具体服务&#xff09;初始化分布式事务客户端完成&#xff0c;代理数据源连接TC&#xff08;Seata服务端&#xff…...

编程日记 2023/2/15 6:35:02

2023如何选购适合游戏设计的电脑硬件

游戏设计涉及许多不同的学科&#xff0c;因此涉及许多不同的软件包。有游戏引擎本身&#xff0c;例如 Unreal Engine 和 Unity&#xff0c;以及 3D 设计软件&#xff0c;例如 3ds Max、Blender 和 ZBrush——等等&#xff01;大多数软件开发人员都维护着这些不同应用程序的系统…...

编程日记 2023/2/15 6:33:57

springboot maven项目集成阿里p3c-pmd插件使用

阿里巴巴规约使用的是pmd代码静态分析工具&#xff0c;通过maven-pmd-plugin这个maven插件实现。 pom文件引入 <!-- 阿里p3c插件 --> <plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-pmd-plugin</artifactId><…...

编程日记 2023/2/15 6:32:52

PowerJob的server启动都经历了哪些？代码不多也很简单，咱们来逐一理解。

这是一篇让你受益匪浅的文章&#xff0c;点个关注交流一下吧~ PowerJob如何使用&#xff0c;官方文档已经说的很详细了&#xff0c;即使没学过计算机的人&#xff0c;按照那上面的步骤来也是可以搭建出一个可以使用的例子来&#xff0c;所以今天就不在这里重复前人的工作&#…...

编程日记 2023/2/15 6:31:45

企业网站管理系统手机版教程/厦门seo排名优化公司

大家好&#xff0c;我是小小教育&#xff0c;欢迎大家关注留言。随着大家上网课时间的推进&#xff0c;现在的学习任务已经完成一大半&#xff0c;而部编版二年级下册《数学》中的除法部分知识&#xff0c;又是一个过渡性很强的知识内容&#xff0c;这部分掌握的好坏&#xff0…...

编程日记 2025/2/12 10:03:54

wordpress无限加载插件/百度外包公司有哪些

最近在写php程序和sql语句时用到了这种写法&#xff1a; selecta,b,c fromtable wherea1AND b2OR c3 <?php fn(1,2,3); 觉得这样写以后方便改东西。 但想想还是没php的数组来得方便。php数组可以写成这样: <?php$arr array(1,2,3, ); 这个逗号&#xff0c;golang还要强…...

编程日记 2025/2/12 9:27:26

省政府网站集约化建设/站长工具查询域名

先这里把unassigned_shards的节点手动删除掉&#xff0c;然后重新配置你的集群 这是应急之策&#xff0c;暂时留用&#xff0c;之后理解后重新解决...

编程日记 2025/2/12 5:41:48

企业网站源码网/2345网址导航浏览器

摘要&#xff1a;本文介绍了一种新基于TensorFlow的python库——TensorLayer&#xff0c;它能够有效的帮助开发者管理好自己的深度学习网络。并且它还提供了很多功能强悍的API&#xff0c;帮助开发者更好的完成任务。 对于深度学习开发者来说&#xff0c;深度学习系统变得越来越…...

编程日记 2025/2/12 2:41:52

网站建设意见征求表/网络推广方案的内容

暂无评价|0人阅读|0次下载|举报文档 DSC曲线的三次样条拟合与Matlab实现_能源/化工_工程科技_专业资料。DSC曲线拟合与Matlab实现第...人阅读|次下载 曲线拟合的最小二乘法matlab举例_中医中药_医药卫生_专业资料。曲线拟合的最小二乘法 学院:光电信息学院 姓名:赵海峰 学号:20…...

编程日记 2025/2/11 21:27:33

班级网站中个人简介怎么做/电脑培训

PROXMOX6.3.6 更改机器名称 参考链接 https://www.baidu.com/link?urlljbh9wHn6YRho6nxxBdbydXNZ3vDERHVZF98SqkDNxJagu4NCtTfvnz5NilOiqqs-peS57O0v5z1t7r2-Zy2dhGQ7D5oIilOM6guFO9uTIa&wd&eqida61791420001d917000000066083e127 参考这个链接准备不停机修改主机名…...

编程日记 2025/2/11 18:27:48