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

【vue】绑定事件 v-on

news 文章来源：https://blog.csdn.net/m0_63070489/article/details/137646538 2024/10/26 15:15:16
  • v-on
    • 简写：@
  • @click
  • @keyup
  • @keydown
  • @keyup.w
  • @keyup.ctrl.a

在这里插入图片描述

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div id="app"><!-- 插值表达式 -->{{msg}}<h2>{{web.title}}</h2><h2>{{web.url}}</h2><!-- v-on例子 --><button v-on:click="edit">修改网址</button><br><!-- v-on简写 --><button @click="edit">修改网址(v-on简写)</button><hr><h2>{{web.user}}</h2>点文本框，按回车<input type="text" @keyup.enter="add(40,60)"><br>点文本框，按空格<input type="text" @keyup.space="add(40,60)"><br>点文本框，按Tab</Table><input type="text" @keydown.tab="add(40,60)"><br>点文本框，按w<input type="text" @keyup.w="add(40,60)"><br>Ctrl+Enter<input type="text" @keyup.ctrl.enter="add(40,60)"><br>Ctrl+a<input type="text" @keyup.ctrl.a="add(40,60)"><br></div><script type="module">import { createApp, reactive } from './vue.esm-browser.js'createApp({setup() {const web = reactive({title: "tao355667",url: "tao355667.com",user: 0})const edit = () => {web.url = "http://www.tao355667.com"}const add = (a, b) => {web.user += a + b}return {msg: "success",web,edit,add}}}).mount("#app")</script>
</body></html>

相关文章：

【vue】绑定事件 v-on

v-on 简写&#xff1a; clickkeyupkeydownkeyup.wkeyup.ctrl.a <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><…...

编程日记 2024/4/17 20:06:18

【应用】SpringBoot-自动配置原理

前言 本文简要介绍SpringBoot的自动配置原理。 本文讲述的SpringBoot版本为&#xff1a;3.1.2。 前置知识 在看原理介绍之前&#xff0c;需要知道Import注解的作用&#xff1a; 可以导入Configuration注解的配置类、声明Bean注解的bean方法&#xff1b;可以导入ImportSele…...

编程日记 2024/4/17 20:04:16

中文编程入门（Lua5.4.6中文版）第十二章 Lua 协程 参考《愿神》游戏

在《愿神》的提瓦特大陆上&#xff0c;每一位冒险者都拥有自己的独特力量——“神之眼”&#xff0c;他们借助元素之力探索广袤的世界&#xff0c;解决谜题&#xff0c;战胜敌人。而在提瓦特的科技树中&#xff0c;存在着一项名为“协同程序”的高级秘术&#xff0c;它使冒险者…...

编程日记 2024/4/17 20:00:12

C++笔记之注册回调函数常见的5种情况对比

C++笔记之注册回调函数常见的5种情况对比 —— 2024-04-10 code review! 文章目录 C++笔记之注册回调函数常见的5种情况对比1.五种情况2.示例2.1. `RegisterCallback` 和 `Callback` 都是普通函数2.2. `RegisterCallback` 是成员函数，`Callback` 是普通函数2.3. `RegisterC…...

编程日记 2024/4/17 19:57:09

人工智能揭示矩阵乘法的新可能性

人工智能揭示矩阵乘法的新可能性 数学家酷爱漂亮的谜题。当你尝试找到最有效的方法时&#xff0c;即使像乘法矩阵&#xff08;二维数字表&#xff09;这样抽象的东西也会感觉像玩一场游戏。这有点像尝试用尽可能少的步骤解开魔方——具有挑战性&#xff0c;但也很诱人。除了魔方…...

编程日记 2024/4/17 19:56:06

实在智能携手长江新零售俱乐部：探秘实在Agent数字员工，开启零售品牌增长新篇章

近日&#xff0c;实在智能携手长江新零售俱乐部成功举办了“AIGC&#xff1a;数字员工助力零售品牌新增长”主题活动&#xff0c;成功吸引了二十余家企业中高层管理精英的踊跃参与。在此次活动中&#xff0c;与会者围绕零售业数字化转型的当前态势、面临的挑战及其重要性进行了…...

编程日记 2024/4/17 19:55:05

计算机科学与导论 第十七 十八章 计算理论，人工智能

文章预览&#xff1a; 计算理论17.1 引言17.2 简单语言17.3 图灵机邱奇 -图灵 论题 人工智能引言18.1.1 什么是人工智能18.1.2 智能体18.1.3 编程语言 18.2 知识的表示18.2.1 语义网18.2.2 框架18.2.3 谓词逻辑18.2.4 基于规则的系统 18.2 专家系统18.3 语言理解18.4 搜索18.5 …...

编程日记 2024/4/17 19:53:03

linux 设置定时任务---学习

1、设置定时任务 crontab -e 设置格式参考&#xff1a;【Linux】Linux crontab 命令定时任务设置_crontab 设置每天10:30执行-CSDN博客 测试过程&#xff1a; */1 * * * * /root/cronjob.sh 脚本内容: echo "hell0 cronjob" >> /root/test/hello.txt 实现…...

编程日记 2024/4/17 19:50:59

钡铼IOy系列模块深挖工业场景需求提供丰富多样的I/O解决方案

钡铼IOy系列模块以其灵活性和多样性&#xff0c;在工业场景中提供了丰富多样的I/O解决方案&#xff0c;满足了不同行业、不同应用场景的需求。以下是一些常见的工业场景需求及钡铼IOy系列模块提供的解决方案&#xff1a; 1. 工厂自动化 需求&#xff1a;工厂自动化需要对生产线…...

编程日记 2024/4/17 19:49:58

【刷题笔记】第三天

两道简单题 文章目录 [2923. 找到冠军 I](https://leetcode.cn/problems/find-champion-i/description/)[3095. 或值至少 K 的最短子数组 I](https://leetcode.cn/problems/shortest-subarray-with-or-at-least-k-i/description/) 2923. 找到冠军 I 方法1&#xff1a; 如果 i …...

编程日记 2024/4/17 19:46:56

开源模型应用落地-LangChain试炼-CPU调用QWen1.5（一）

一、前言 尽管现在的大语言模型已经非常强大&#xff0c;可以解决许多问题&#xff0c;但在处理复杂情况时&#xff0c;仍然需要进行多个步骤或整合不同的流程才能达到最终的目标。然而&#xff0c;现在可以利用langchain来使得模型的应用变得更加直接和简单。 通过langchain框…...

编程日记 2024/4/17 19:45:55

STM32-模数转化器

ADC(Analog-to-Digital Converter) 指模数转换器。是指将连续变化的模拟信号转换 为离散的数字信号的器件。 ADC相关参数说明&#xff1a; 分辨率&#xff1a; 分辨率以二进制&#xff08;或十进制&#xff09;数的位数来表示&#xff0c;一般有 8 位、10 位、12 位、16 位…...

编程日记 2024/4/17 19:42:51

算法刷题记录2

4.图 4.1.被围绕的区域 思路&#xff1a;图中只有与边界上联通的O才不算是被X包围。因此本题就是从边界上的O开始递归&#xff0c;找与边界O联通的O&#xff0c;并标记为#&#xff08;代表已遍历&#xff09;&#xff0c;最后图中剩下的O就是&#xff1a;被X包围的O。图中所有…...

编程日记 2024/4/17 19:39:47

中国代工巨头旗下芯片公司遭网络攻击，千兆字节数据被泄露

近日&#xff0c;中国智能手机代工巨头闻泰科技旗下荷兰芯片制造商Nexperia发布声明&#xff0c;称其遭遇网络攻击&#xff0c;有未经授权的第三方访问了公司的 IT 服务器&#xff0c;目前已向相关部门报告了此次事件&#xff0c;并与网络安全专家合作开启调查。而据相关消息&a…...

编程日记 2024/4/17 19:37:42

【ARM 裸机】汇编 led 驱动之基本语法

我们要编写的是 ARM 汇编&#xff0c;编译使用的是 gcc 交叉编译器&#xff0c;所以要符合 GNU 语法。 1、汇编指令 汇编由一条条指令构成&#xff0c;ARM 不能直接访问存储器&#xff0c;比如 RAM 中的数据&#xff0c;I.MX6UL 中的寄存器就是 RAM 类型的&#xff0c;我们用…...

编程日记 2024/4/17 19:34:39

scala---基础核心知识（变量定义，数据类型，流程控制，方法定义，函数定义）

一、什么是scala Scala 是一种多范式的编程语言&#xff0c;其设计初衷是要集成面向对象编程和函数式编程的各种特性。Scala运行于Java平台&#xff08;Java虚拟机&#xff09;&#xff0c;并兼容现有的Java程序。 二、为什么要学习scala 1、优雅 2、速度快 3、能融合到hado…...

编程日记 2024/4/17 19:33:36

OSPF星型拓扑和MGRE全连

一&#xff0c;拓扑 二&#xff0c;要求 1&#xff0c;R6为ISP只能配置IP地址&#xff0c;R1-R5的环回为私有网段 2&#xff0c;R1/4/5为全连的MGRE结构&#xff0c;R1/2/3为星型的拓扑结构&#xff0c; 3&#xff0c;R1为中心站点所有私有网段可以互相通讯&#xff0c;私有网段…...

编程日记 2024/4/17 19:31:34

智能时代中的工业应用中前所未有的灵活桥接和I/O扩展功能解决方案MachXO2系列LCMXO2-1200HC-4TG100I FPGA可编程逻辑IC

lattice莱迪斯 MachXO2系列LCMXO2-1200HC-4TG100I超低密度FPGA现场可编程门阵列&#xff0c;适用于低成本的复杂系统控制和视频接口设计开发&#xff0c;满足了通信、计算、工业、消费电子和医疗市场所需的系统控制和接口应用。 瞬时启动&#xff0c;迅速实现控制——启动时间…...

编程日记 2024/4/17 19:30:33

php：实现压缩文件上传、解压、文件更名、压缩包删除功能

效果图 1.上传文件 2.压缩包文件 3.itemno1文件 或 4.上传到系统路径\ItemNo 5.更名后的itemno1文件(命名&#xff1a;当天日期六位随机数) 代码 <form action"<?php echo htmlspecialchars($_SERVER[PHP_SELF], ENT_QUOTES, UTF-8); ?>" methodpost en…...

编程日记 2024/4/17 19:29:31

【机器学习】科学库使用第5篇：Matplotlib,学习目标【附代码文档】

机器学习&#xff08;科学计算库&#xff09;完整教程&#xff08;附代码资料&#xff09;主要内容讲述&#xff1a;机器学习&#xff08;常用科学计算库的使用&#xff09;基础定位、目标&#xff0c;机器学习概述定位,目标,学习目标,学习目标,1 人工智能应用场景,2 人工智能小…...

编程日记 2024/4/17 19:28:30

Java面试八股文(JVM篇)(❤❤)

Java面试八股文_JVM篇 1、知识点汇总2、知识点详解&#xff1a;3、说说类加载与卸载11、说说Java对象创建过程12、知道类的生命周期吗&#xff1f;14、如何判断对象可以被回收&#xff1f;17、调优命令有哪些&#xff1f;18、常见调优工具有哪些20、你知道哪些JVM性能调优参数&…...

编程日记 2024/4/17 19:27:28

「51媒体」如何有效进行媒体邀约，提升宣传传播效果？

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 进行有效的媒体邀约&#xff0c;提升宣传传播效果的关键在于策略性和专业性。以下是具体的做法&#xff1a; 明确目标&#xff1a;要确立清晰的品牌推广目标和策略&#xff0c;包括确定目…...

编程日记 2024/4/17 19:25:26

docker初始化进程

docker run --init 是一个 Docker 命令的选项&#xff0c;用于在容器中运行一个初始化进程&#xff08;通常是 tini&#xff09;。这个初始化进程负责处理一些 Unix 信号&#xff08;如 SIGTERM 和 SIGCHLD&#xff09;&#xff0c;并确保容器中的进程能够正确地被管理和清理。…...

编程日记 2024/4/17 19:24:24

基于快照行情的股票/基金 1分钟 K 线合成指南

1. 概述 由于不同交易所不同资产的交易规则是有差异的&#xff0c;导致不同交易所基于快照行情或逐笔成交合成不同资产1分钟 K 线的计算方法是不同的。 本教程旨在提高 DolphinDB 在具体业务场景下的落地效率&#xff0c;降低 DolphinDB 在实际业务使用中的开发难度。 本教程…...

编程日记 2024/4/17 19:21:20

新质生产力崛起：精益化能力助力企业转型升级

在智能制造、物联网、大数据、大模型、AI风起云涌的时代背景下&#xff0c;一个崭新的概念——“新质生产力”逐渐进入了人们的视野。这一热词不仅成为今年两会的讨论焦点&#xff0c;更代表了企业、国家乃至社会未来发展的核心动能。那么&#xff0c;什么是新质生产力&#xf…...

编程日记 2024/4/17 19:20:19

开发了一个在线客服系统

开发了一个在线客服系统 作为程序员&#xff0c;我一直在寻找能够提高工作效率和用户体验的方法。最近&#xff0c;我成功开发了一个在线客服系统&#xff0c;这个系统旨在帮助企业更高效地管理客户咨询和服务流程。 技术栈 我选择了以下的技术栈来构建这个系统&#xff1a;…...

编程日记 2024/4/17 19:19:16

cowa新的数据筛选代码

cowa新的数据筛选代码 代码地址&#xff1a; https://git.cowarobot.com/lhb/data_extracting 一阶段筛选 修改配置文件 config/common_stage.yamlversion: 3 services:de:image: harbor.cowarobot.cn/lhb/data:crpilot2.5-torch2.2environment:- CRPILOT_INSTALL_VERSIONx86…...

编程日记 2024/4/17 19:17:14

项目篇 | 图书管理系统 | 管理员模块 | 图书管理 | 删除

项目篇 | 图书管理系统 | 管理员模块 | 图书管理 | 删除 概述 图书管理页通过列表展示所有图书的相关信息，集成了搜索、添加、删除、修改的功能。 函数简介 // admin.h void delBook(); // 删除图书 void openDelBookMessage(); // 打开删除图书弹框 void closeDelBookMessa…...

编程日记 2024/4/17 19:15:12

自己动手封装axios通用方法并上传至私有npm仓库：详细步骤与实现指南

文章目录 一、构建方法1、api/request.js2、api/requestHandler.js3、api/index.js 二、测试方法1、api/axios.js2、main.js3、app.vue4、vue.config.js5、index.html 三、打包1、配置package.json2、生成库包3、配置发布信息4、发布 四、使用1、安装2、使用 五、维护1、维护和…...

编程日记 2024/4/17 19:14:11

【Sql Server】锁表如何解锁，模拟会话事务方式锁定一个表然后进行解锁

大家好&#xff0c;我是全栈小5&#xff0c;欢迎来到《小5讲堂》。 这是《Sql Server》系列文章&#xff0c;每篇文章将以博主理解的角度展开讲解。 温馨提示&#xff1a;博主能力有限&#xff0c;理解水平有限&#xff0c;若有不对之处望指正&#xff01; 目录 前言创建表模拟…...

编程日记 2024/4/17 19:13:10

网站建设特效大全/b站推广入口2022

一个偶然机会网站上看到了aistudio&#xff0c;本次普及一下ai知识的目的进去看了一下&#xff0c;发现尽然有免费课程&#xff0c;而且是面向小白&#xff0c;虽然大学时期学过计算机课&#xff0c;但是基本都还给了老师&#xff0c;本着试试的心态&#xff0c;还是参加了该课…...

编程日记 2024/10/26 14:59:47

html5网站建设基本流程图/宁波如何做抖音seo搜索优化

题目传送门 1 /*2 题意&#xff1a;给n, k&#xff0c;然后允许给某一个数加上k的正整数倍&#xff0c;当然可以不加&#xff0c;3 问你是否可以把这n个数变成1,2,3,...,n, 可以就输出Jerry, 否则输出Tom。4 贪心&#xff1a;保存可能变成的值的方案数&#xf…...

编程日记 2024/10/26 14:41:15

网站适配怎么做/河南靠谱seo电话

宝可梦世界无极限这款游戏结合了宝可梦与沙盒冒险的元素&#xff0c;超高的可玩性&#xff0c;玩家们在这个游戏世界里进行冒险&#xff0c;非常有意思&#xff0c;能够收获到极佳的新奇体验感&#xff0c;不断进行探索&#xff0c;你将会发现很多有趣的新事物&#xff0c;让玩…...

编程日记 2024/10/26 14:26:06

wordpress 栏目 主题/新手做电商怎么起步

刚刚学习 SHELL 写了一个简单的例子 发生如下错误-bash: ./test.sh: /bin/bash^M: bad interpreter: No such file or directoryVI打开文件&#xff0c;没发现任何问题&#xff0c;把/bin/bash改成/bin/sh-bash: ./test.sh: /bin/sh^M: bad interpreter: No such file or direc…...

编程日记 2024/10/26 9:04:24

延吉网站制作/如何写市场调研报告

NAnt比较老的持续集成工具了&#xff0c;对于它的文章都停留在09年左右的&#xff0c;只有一些github上的老项目上可以很多的看见是使用这个进行集成的&#xff0c;估计这个当时老外用的非常多吧。 如题&#xff0c;NAnt如果使用单元测试&#xff0c;用的最多的应该是NUnit&…...

编程日记 2024/10/26 8:28:32

潍坊网站制作价格/链接制作

【C】C中"std::"是什么意思&#xff1f;起什么作用&#xff1f;STDSTDSTD是一个标准输入输出类STDSTDSTD定义#include<iostream>\#include<iostream>#include<iostream>iostreamiostreamiostream和iostream.hiostream.hiostream.h的区别什么时候在…...

编程日记 2024/10/26 6:43:44