简单的vue入门案例

一、 简单入门Hello World案例

在这里插入图片描述

二、插值表达式

在这里插入图片描述

三、点击事件

在这里插入图片描述

四、按键事件

1.如果按下不是 0 - 9 则阻止事件执行

在这里插入图片描述

2.打印按下什么按键

在这里插入图片描述

五、鼠标事件

1.打印绝对坐标

在这里插入图片描述

2.打印相对坐标

在这里插入图片描述

3.鼠标mousemove

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

4. 阻止冒泡(阻止事件的传播)

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

六、事件修饰符

1.阻止跳转页面v-on:submit.prevent

@click == v-on:click
在这里插入图片描述

2.阻止向上传递@click.stop

在这里插入图片描述

七、按键修饰符

1.指定键盘按下的键@keyup.ctrl.+字母对应的ASICC

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/333200.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

javafx 调用java_Java,JavaFX的流畅设计风格进度栏

javafx 调用java按照承诺,刚刚发布的Java JavaFX主题JMetro版本4.6为进度栏带来了新样式。 进度栏有两种可能的状态:确定和不确定,新的JMetro版本针对这两种具有不同的样式。 在本文中,我还将详细介绍我在JMetro中遵守的一些API设…

vue基本用法

一、v-text与v-html.html v-html 可以解析标签&#xff0c;解析样式,v-text不能解析&#xff0c;只能原样输出 二、v-bind绑定参数 v-bind简写方式 <!-- 完整语法 --> <a v-bind:href"url">...</a> <!-- 缩写 --> <a :href"url&q…

类Unix系统下,vim各种模式之间的切换

文章目录普通命令模式插入模式&#xff08;编辑模式&#xff09;临时切换到普通命令模式可视模式&#xff08;文本选择模式&#xff09;底行命令模式&#xff08;EX 命令模式&#xff09;普通命令模式 vim 的默认模式就是普通命令模式&#xff0c; 使用 vim 打开文件就进入普通…

jdk12 switch_玩JDK 12的Switch表达式

jdk12 switch在博客文章“操作中的JDK语言功能预览&#xff1a;切换表达式 ”中&#xff0c;我讨论了JEP 325 [“切换表达式&#xff08; 预览 &#xff09;”&#xff09;如何作为指定的“ 预览语言功能 ”的早期应用&#xff0c;如JEP 12所述。预览语言和VM功能”]。 JEP 325…

VueJS生命周期

一、生命周期 vue在生命周期中有这些状态&#xff0c; beforeCreate,created,beforeMount,mounted,beforeUpdate,updated,beforeDestroy,destroyed。Vue 在实例化的过程中&#xff0c;会调用这些生命周期的钩子&#xff0c;给我们提供了执行自定义逻辑的机会。 vue对象初始化过…

Linux的命令之 man -- 查看帮助文档

文章目录浏览文本内容的快捷键向前滚屏向后滚屏跳跃搜索使用这个命令可以查看任何命令的在线帮助文件&#xff0c;例如&#xff0c;查看命令 find 的在线帮助文档&#xff1a; [roothtlwk0001host ~]# man find打开命令的帮助文档后&#xff0c;可以使用鼠标滚轮上下滚动来浏览…

jdk8切换成jdk6_运行中的JDK语言功能预览:切换表达式

jdk8切换成jdk6JEP 12 [“预览语言和VM功能”]在其主页上描述如下&#xff1a; 预览语言或VM功能是Java SE平台的一项新功能&#xff0c;该功能已完全指定&#xff0c;完全实现但不是永久性的。 JDK功能发布中提供了该功能&#xff0c;以根据实际使用情况激发开发人员反馈。 这…

VueJS ajax综合案例

一、目录结构和注意事项 1.目录结构 2.注意事项 &#xff08;1&#xff09;data.html里面的Vue &#xff08;2&#xff09;箭头函数 二、引入依赖 <?xml version"1.0" encoding"UTF-8"?><project xmlns"http://maven.apache.org/POM/4.0…

Linux 下如何查找 MySQL 数据库的数据根目录呢?

笔者的服务器系统和MySQL版本如下&#xff1a; [roothtlwk0001host ~]# mysql -V mysql Ver 14.14 Distrib 5.7.31, for Linux (x86_64) using EditLine wrapper [roothtlwk0001host ~]# cat /etc/redhat-release CentOS Linux release 8.2.2004 (Core) MySQL 的配置文件路径…

libreoffice_利用Excel或LibreOffice的业务输入进行单元测试约束

libreoffice业务专家向我们&#xff08;开发人员&#xff09;解释业务限制。 但是&#xff0c;如何确保我们正确理解它们呢&#xff1f; 或更糟糕的是&#xff0c;一旦约束条件正式化&#xff0c;我们如何测试他们之间是否同意&#xff1f; 好吧&#xff0c;有一种很棒的方法可…

VueJS ajax综合案例(修改用户信息实现步骤)

修改用户信息 1.过程演示 2.代码实现

MacOS下如何通过命令搜索文件和打开文件

文章目录find 命令查找名称含有指定关键词的文件和目录locate 命令查找以指定字符串结尾的文件路径查看命令 locate 的使用说明mdfind 命令查找名称中含有指定关键词的文件搜索内容中包含指定关键词的文件在指定目录中搜索内容包含指定关键词或者名称含有指定关键词的文件搜索并…

多云和混合云_多云互操作性!=云服务聚合

多云和混合云多云定义为一种方法&#xff0c;该方法将来自多个云供应商的多个云&#xff08;公共云或私有云&#xff09;组合在一起。 但是&#xff0c;这不是来自不同供应商的各种服务的集合&#xff0c;它需要一种强制性的胶合剂–云不可知的方法&#xff0c;并在所有提供商之…

安装、启动、配置zookeeper(window版)

安装zookeeper (1)解压安装包 &#xff08;2&#xff09;修改zoo_sample.cfg文件名为&#xff1a;zoo.cfg (3)在加压文件下建立data文件夹 &#xff08;4&#xff09;修改zoo.cfg (5)启动 注意如果zookeeper启动失败有可能是&#xff0c;第二步的zoo_sample.cfg文件名没改&…

命令终端(CMD)自动补全功能 — Tab Complete 功能

处理特殊字符 如果目录中有特殊字符&#xff08;空格&#xff0c;括号&#xff0c;引号&#xff0c;[]&#xff0c;!&#xff0c;$&#xff0c;&&#xff0c;*&#xff0c;;&#xff0c;|&#xff0c;\&#xff09;&#xff0c;必须使用特殊的语法来表示这些字符。例如&am…

自动驾驶行车记录仪训练集_无服务器安全性:将其置于自动驾驶仪上

自动驾驶行车记录仪训练集Ack &#xff1a;本文是从个人经验以及从无服务器安全性的其他多个来源学到的东西的混合。 我无法在这里列出或确认所有这些信息&#xff1b; 但是&#xff0c;应该特别感谢The Register &#xff0c; Hacker Noon &#xff0c; PureSec以及Serverless…

MySQL数据库模式(SQL_MODE)中的STRICT_TRANS_TABLES和STRICT_ALL_TABLES

-InnodbMyisamSTRICT_TRANS_TABLES无论插入单行或是多行&#xff0c;只要插入数据与字段类型不兼容&#xff0c;则insert操作失败并回滚插入单行数据与字段类型不兼容&#xff0c;则insert操作失败并回滚&#xff1b;插入多行数据&#xff0c;如果插入数据的第一行内容与字段类…

spock 集成测试_Spock 1.2 –轻松进行集成测试中的Spring Bean模拟

spock 集成测试探索如何使用Spock 1.2将Spock的模拟和间谍自动注入到Spring上下文中。 Spock中的存根/模拟/间谍&#xff08;及其生命周期&#xff09;一直与Spock Specification类紧密结合。 只能在测试类中创建它们。 因此&#xff0c;使用共享的&#xff0c;预定义的模拟&a…

dubbo中log4j检查(开发环境中建议设置为false)

一、在pom.xml里面引入依赖 1. 添加log4j文件 2. 文件内容 # Set root category priority to INFO and its only appender to CONSOLE. #log4j.rootCategoryINFO, CONSOLE debug info warn error fatal log4j.rootCategorydebug, CONSOLE, LOGFILE, info # Set…

Linux 命令之 useradd -- 添加用户

文章目录简介相关文件内容说明常用选项参考示例添加新用户 test添加新用户 test&#xff0c;且不创建家目录&#xff0c;并且禁止登陆添加新用户 test&#xff0c;指定 UID 为 888&#xff0c;指定归属用户组为 root&#xff0c;cool&#xff0c;其默认使用的 shell 类型为 /bi…