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

vue v-on 艾特@

news 2026/5/22 3:14:23

vue v-on

内联代码：

<!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"><button v-on:click="count++">+</button><div>{{ count }}</div><button @click="count--">-</button></div><script src="https://cdn.bootcdn.net/ajax/libs/vue/2.7.14/vue.js"></script><script>const app = new Vue({el: '#app',data: {count: 100,}})</script></body></html>

运行效果
在这里插入图片描述

methods方法

<!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><script src="https://cdn.bootcdn.net/ajax/libs/vue/2.7.14/vue.js"></script><div id="app"><button @click="fn"> 切换显示 </button><p v-show='isShow'> Hello </p></div><script>const app = new Vue({el: '#app',data: {isShow: true,},methods: {fn() {this.isShow = !this.isShow;},}})</script></body></html>

在这里插入图片描述

带参数

<!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"><h3>小黑自动售货机</h3><button @click="buy(5)">可乐5元</button><button @click="buy(10)">咖啡10元</button><button @click="buy(8)">牛奶8元</button><p>银行卡余额：{{ money }}元</p></div><script src="https://cdn.bootcdn.net/ajax/libs/vue/2.7.14/vue.js"></script><script>const app = new Vue({el: '#app',data: {money: 100,},methods: {buy(price) {this.money -= price},}})</script></body></html>

演示

在这里插入图片描述

相关文章：

vue v-on 艾特@

vue v-on 内联代码&#xff1a; <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</titl…...

编程日记 2023/9/2 19:30:43

【Ajax】发送跨域的POST请求时，浏览器会先发送一次OPTIONS请求，然后才发送原本的POST请求

当发送跨域的POST请求时&#xff0c;浏览器会先发送一次OPTIONS请求&#xff0c;这是因为浏览器的同源策略。OPTIONS请求被称为预检请求(pre-flight request)&#xff0c;它是CORS(跨源资源共享)机制中的一部分。 预检请求的目的是为了确保实际请求&#xff08;例如POST、PUT等…...

编程日记 2023/9/2 19:29:42

np.numpy, np.reshape, np.cumsum方法速查

1 np.numpy() 创建一个数组 state[[1,2,3,4,5],[6,7,8,9,10],[11,12,13,14,15]] state2np.array(state) print(state) print(state2)[[1, 2, 3, 4, 5], [6, 7, 8, 9, 10], [11, 12, 13, 14, 15]] [[ 1 2 3 4 5] [ 6 7 8 9 10] [11 12 13 14 15]] 2 np.reshape() 常用于矩阵规…...

编程日记 2023/9/2 19:28:41

七、Kafka-Kraft 模式

目录 7.1 Kafka-Kraft 架构7.2 Kafka-Kraft 集群部署 7.1 Kafka-Kraft 架构 左图为 Kafka 现有架构&#xff0c;元数据在 zookeeper 中&#xff0c;运行时动态选举 controller&#xff0c;由controller 进行 Kafka 集群管理 右图为 kraft 模式架构&#xff08;实验性&#xff…...

编程日记 2023/9/2 19:27:39

jvm开启远程调试功能；idea远程debug

概述 有时候一些问题本地调试无法复现&#xff0c;这个时候可以开启jvm的远程调试功能 jar包启动 jdk8 java -agentlib:jdwptransportdt_socket,address8787,servery,suspendn -jar xxx.jarjdk11/17 java -agentlib:jdwptransportdt_socket,address*:8787,servery,suspe…...

编程日记 2023/9/2 19:26:38

视频汇聚/视频云存储/视频监控管理平台EasyCVR视频平台添加萤火云设备的具体操作步骤

安防视频监控/视频集中存储/云存储/磁盘阵列EasyCVR平台可拓展性强、视频能力灵活、部署轻快&#xff0c;可支持的主流标准协议有国标GB28181、RTSP/Onvif、RTMP等&#xff0c;以及支持厂家私有协议与SDK接入&#xff0c;包括海康Ehome、海大宇等设备的SDK等。平台既具备传统安…...

编程日记 2023/9/2 19:25:37

vue 加载图片不显示

解决vue加载图片不显示问题 加载图片前边加上require require通常用于引入静态资源&#xff0c;如图片、样式文件等。 navList: [{ title: "大盘行情", imgSrc: require ("../../public../../public/imgs/nav1.png") , linkto: "" },{ title: &q…...

编程日记 2023/9/2 19:24:36

Java for循环每次都通过list.size()和 string.length()获取大小性能

有人说在for循环之前用一个局部变量先获取到list.size()、str.length()&#xff0c;然后在for循环的判断条件里通过这个局部变量替换list.size()、str.length()会节省数据计算的时间。事实真的是这样吗&#xff1f;下面就为大家解答这个问题。 说明&#xff1a;此文章针对Andro…...

编程日记 2023/9/2 19:23:34

面试题 08.01. 三步问题

​​题目来源&#xff1a; leetcode题目&#xff0c;网址&#xff1a;面试题 08.01. 三步问题 - 力扣&#xff08;LeetCode&#xff09; 解题思路&#xff1a; 动态规划。1 阶楼梯 1 种走法&#xff0c;2 阶楼梯 2 种走法&#xff0c;3 阶楼梯 6 种类走法。假设有 n(n>3) 阶…...

编程日记 2023/9/2 19:22:33

springboot添加SSL证书，支持https与http

文章目录 一、添加ssl证书二、配置文件三、配置同时支持HTTPS与HTTP四、启动 一、添加ssl证书 将证书文件放在/resource目录下 二、配置文件 修改配置文件 server:ssl:# 指定保存SSL证书的秘钥存储的路径key-store: classpath:dev.cobona.cn.pfx# 访问秘钥存储的密码key-store-…...

编程日记 2023/9/2 19:21:32

【AI】《动手学-深度学习-PyTorch版》笔记（二十）：图像增强、微调

AI学习目录汇总 1、图像增强 图像增强可以扩展训练样本数量、减小对某个属性的依赖。比如，裁剪图像，可以减少模型对对象出现位置的依赖；调整亮度、颜色等因素来降低模型对颜色的敏感度等 1.1、准备工作 头文件 %matplotlib inline：图表直接嵌入到Notebook中，本人使用的…...

编程日记 2023/9/2 19:20:31

Vulnhub: Ragnar Lothbrok: 1靶机

kali&#xff1a;192.168.111.111 靶机&#xff1a;192.168.111.226 信息收集 端口扫描 nmap -A -sC -v -sV -T5 -p- --scripthttp-enum 192.168.111.226 作者提示修改hosts文件 目录爆破 gobuster dir -u http://armbjorn -w /usr/share/wordlists/dirbuster/directory-l…...

编程日记 2023/9/2 19:19:29

Ubuntu 20.04 Server配置网络

0&#xff0c;环境 服务器&#xff1a; Intel(R) Xeon(R) Gold 6248R CPU 3.00GHz 96核 网卡&#xff1a; 多网卡 1&#xff0c; 镜像下载 http://old-releases.ubuntu.com/releases/ubuntu-20.04.1-desktop-amd64.iso 2&#xff0c; 系统安装--具体步骤就不贴出来&#…...

编程日记 2023/9/2 19:18:27

jmeter 线程组

在jmeter中&#xff0c;通过指定并发数量、启动延迟时间和持续时间&#xff0c;并组织示例&#xff08;Samplers&#xff09;在多个线程之间的执行方式&#xff0c;实现模拟并发用户的行为。 添加线程组&#xff1a; 在测试计划中&#xff0c;右键点击“添加” -> “Thread…...

编程日记 2023/9/2 19:16:21

springboot集成logback

1、引入maven依赖 <!--logback日志--><dependency><groupId>ch.qos.logback</groupId><artifactId>logback-classic</artifactId><version>1.2.3</version></dependency>2、再resource下面新建一个文件名称为 logback-s…...

编程日记 2023/9/2 19:15:18

【从互联网商业思维的角度分析商业模式在国内各大互联网产品的运用】

随着互联网技术的不断进步&#xff0c;互联网商业模式也在不断变化&#xff0c;各个互联网企业都在不断尝试各种商业模式&#xff0c;以满足不同消费者群体的需求&#xff0c;提高企业营销效益&#xff0c;下面我们将从互联网商业思维的角度&#xff0c;分析一下商业模式在国内…...

编程日记 2023/9/2 19:14:14

Leetcode394 字符串解码

思路&#xff1a;类似于入栈出栈的操作&#xff0c;分层保存数字和字符串&#xff0c;然后逐层相乘合并&#xff0c;通过判断当前字符和上一个字符类型来确定数字是否结束 class Solution:def decodeString(self, s: str) -> str:current_str [""]current_num[]…...

编程日记 2023/9/2 19:13:13

git学习笔记 | 版本管理 - 分支管理

文章目录 git学习笔记Git是什么仓库常见的命令commit 备注规范在文件下设置git忽略文件 .gitignore 版本管理git log | git reflog 查看提交日志/历史版本版本穿梭 git resetgit reset HEAD <file> git checkout -- fileName 丢弃工作区的修改git revertGit恢复之前版本的…...

编程日记 2023/9/2 19:12:12

pytest---添加自定义命令行参数（pytest_addoption ）

前言 在目前互联网公司中&#xff0c;都会存在多个测试环境&#xff0c;那么当我们编写的自动化想要在多套测试环境下进行运行时&#xff0c;如何使用&#xff1f;大多数人想到的可能是通过将我们自动化代码中的地址修改成不同环境&#xff0c;但是这时候就会增加一些工作量&am…...

编程日记 2023/9/2 19:11:11

Flutter开发- iOS 问题CocoaPods not installed or not in valid state

解决问题方案&#xff1a; 1、先检查本机CocoaPods是否安装&#xff0c;通过gem list 查看是否安装 打开终端&#xff0c;执行gem list&#xff0c;出现图中的数据即为已安装。未安装看第4 步 2、已经安装了CocoaPods&#xff0c;还出现了图中的提示&#xff0c;你可能已经猜…...

编程日记 2023/9/2 19:10:10

应对每日大赛突发需求，用Taotoken多模型聚合能力灵活选型

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 应对每日大赛突发需求&#xff0c;用Taotoken多模型聚合能力灵活选型 在每日大赛这类节奏快、任务多变的场景里&#xff0c;开发者…...

编程新知 2026/5/22 2:23:38

福建话TTS落地难？手把手教你绕过ElevenLabs官方未公开的闽东方言/莆仙话语音注入方案，限时可复现

更多请点击&#xff1a; https://kaifayun.com 第一章&#xff1a;福建话TTS落地难&#xff1f;手把手教你绕过ElevenLabs官方未公开的闽东方言/莆仙话语音注入方案&#xff0c;限时可复现 ElevenLabs 官方 API 当前仅支持普通话、粤语等主流中文变体&#xff0c;对闽东方言&a…...

编程新知 2026/5/22 0:56:16

开源 AI Agent Harness Engineering 模型与闭源模型的对比

开源 AI Agent Harness Engineering 模型与闭源模型的对比 摘要 如果把AI Agent比作自动驾驶汽车&#xff0c;那么AI Agent Harness就是这辆车的操作系统&#xff1a;它负责管控任务规划、工具调用、记忆管理、容错重试等所有核心逻辑&#xff0c;是Agent落地工程化的核心支撑…...

编程新知 2026/5/22 0:20:16

Superpowers 总览与原理（通俗版）

一句话结论 Superpowers 不是一个“新模型”&#xff0c;而是一套“技能&#xff08;skills&#xff09; 启动引导&#xff08;bootstrap&#xff09;”的工作流层&#xff0c;用明确的流程和纪律约束智能体如何思考、如何拆解任务、如何实现与复核。 它是怎么用的&#xff08;…...

编程新知 2026/5/22 0:05:33

30天学会AI工程师｜Day 13：Tool Calling 不是高级玩法，它是 Agent 开始有手脚的那一步

你先知道一件事 很多人第一次听到 Tool Calling&#xff0c;会觉得这是很后面的内容&#xff0c;好像得先学完模型、Prompt、框架&#xff0c;再轮到它。 为什么这一步重要 其实从工程视角看&#xff0c;它反而是一个很早就该理解的能力。 因为大模型只会“生成文本”这件事&am…...

编程新知 2026/5/21 22:08:12

AI人工智能行业的现状：为什么说AI从业者的需求越来越大

一、AI产业爆发式增长&#xff1a;需求激增的时代底色2026年&#xff0c;人工智能产业已步入爆发式增长的黄金期&#xff0c;成为驱动全球经济复苏与产业变革的核心引擎。从全球市场来看&#xff0c;2025年AI市场规模达7575.8亿美元&#xff0c;同比增长18.7%&#xff0c;预计2…...

编程新知 2026/5/21 21:40:06

Chrome密码恢复终极指南：如何安全找回所有浏览器保存的密码

Chrome密码恢复终极指南&#xff1a;如何安全找回所有浏览器保存的密码 【免费下载链接】chromepass Get all passwords stored by Chrome on WINDOWS. 项目地址: https://gitcode.com/gh_mirrors/chr/chromepass 你是否曾经因为忘记某个重要网站的密码而焦虑&#xff1…...

编程新知 2026/5/21 21:36:02

超自动化运维，您需要的是“可信执行平台（TEP）”

在AI智能体与自动化工具蓬勃发展的今天&#xff0c;各类开源框架与轻量工具层出不穷。它们让“用自然语言驱动电脑做事”的愿景触手可及——文件操作、脚本执行、浏览器控制&#xff0c;一切看似高效便捷。然而&#xff0c;当我们将视线从个人桌面转向企业的数据中心、核心生产…...

编程新知 2026/5/21 21:19:50

别再只用TabBar了！用Qt QML的Repeater和ListView打造更灵活的侧边栏导航（附完整源码）

超越TabBar&#xff1a;用QML的Repeater与ListView构建动态导航系统 当标准导航控件无法满足现代应用界面需求时&#xff0c;Qt Quick的模型-视图架构提供了更强大的解决方案。本文将深入探讨如何利用Repeater和ListView构建高度可定制的侧边栏导航系统&#xff0c;通过对比分析…...

编程新知 2026/5/21 20:58:36

告别Excel！用Python复现地理探测器（附完整代码与示例数据）

告别Excel&#xff01;用Python复现地理探测器&#xff08;附完整代码与示例数据&#xff09; 地理探测器作为分析空间分异性的重要工具&#xff0c;长期以来依赖Excel插件实现计算。但对于需要批量处理、自定义分析流程的研究者而言&#xff0c;这种封闭式操作存在明显局限。…...

编程新知 2026/5/21 20:53:58