Vue 事件的基本使用与语法差异
"v-on:"可以简写为"@"
"click"单击
"dblclick"双加
代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="vue.js"></script>
<title id="title">{{title}}</title>
</head>
<body>
<div id="ask"><!--vue不能控制body和html的标签-->
<ul>
<li v-for="(v,k) in list">
{{v.id}} ===== {{v.content}}
<button @click="remove(v.id)">单击</button>
<button @dblclick="remove(v.id)">双击</button> </li>
</ul>
</div>
<script>
var vue = function (options){new Vue(options)};
vue({
el:'#title',
data:{
title:'Vue 事件的基本使用与语法差异'
}
});
var app = vue({
el:'#ask',
data:{
search_content:'',
content:'',
list:[
{'id':3,'content':'hello'},
{'id':5,'content':'简单记录'},
{'id':2,'content':'个人博客'},
{'id':1,'content':'学习笔记'},
{'id':4,'content':'想学什么学什么 '}
]
},
methods:{ remove(k){
console.log(k);
} }
}); </script>
</body>
</html>
Vue 事件的基本使用与语法差异的更多相关文章
- C#与Java的语法差异
C#与Java的语法差异C与Java的语法差异前言程序结构基本语法数据类型字符串变量与常量运算符判断语句循环语句访问权限方法数组结构枚举类继承多态运算符重载接口命名空间预处理器指令正则表达式异常IO泛 ...
- Vue事件绑定原理
Vue事件绑定原理 Vue中通过v-on或其语法糖@指令来给元素绑定事件并且提供了事件修饰符,基本流程是进行模板编译生成AST,生成render函数后并执行得到VNode,VNode生成真实DOM节点 ...
- Vue的基本使用和模版语法
Vue的基本使用和模版语法 一.Vue概述 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架 vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目 ...
- Sqlite基础及其与SQLServer语法差异
1 TOP 这是一个大家经常问到的问题,例如在SQLSERVER中可以使用如下语句来取得记录集中的前十条记录: SELECT TOP 10 * FROM [index] ORDER BY indexi ...
- vue 2.0 无法编译ES6语法
# vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...
- C++、Java语法差异对照表
C++.Java语法差异对照表 C++ and Java Syntax Differences Cheat Sheet First, two big things--the main function ...
- Kotlin VS Java：基本语法差异
Kotlin比Java更年轻,但它是一个非常有前途的编程语言,它的社区不断增长. 每个人都在谈论它,并说它很酷. 但为什么这么特别? 我们准备了一系列文章,分享我们在Kotlin开发Android应用 ...
- Vue—事件修饰符
Vue事件修饰符 Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation(). Vue. ...
- vue 事件上加阻止冒泡 阻止默认事件
重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...
随机推荐
- jQuery的延迟对象（十一）
在前端这个领域里面,ajax请求非常常见. // 前提引入jquery $.ajax({ type: 'get', url: '/path/to/data', success: function (r ...
- bzoj 5218: [Lydsy2017省队十连测]友好城市
题意: 这题显然直接tarjan是做不了的. 这里安利另一个求SCC的算法Kosaraju,学习的话可以见这篇博客 于是结合莫队,我们有了个暴力. 发现主要瓶颈是dfs过程中找最小的未经过的点,我们用 ...
- Tarjan在图论中的应用（三）——用Tarjan来求解2-SAT
前言 \(2-SAT\)的解法不止一种(例如暴搜?),但最高效的应该还是\(Tarjan\). 说来其实我早就写过用\(Tarjan\)求解\(2-SAT\)的题目了(就是这道题:[2019.8.14 ...
- 利用Python几行代码批量生成验证码
几行代码批量生成authCode 整体步骤: 1.创建图片 2.创建画笔 3.在图片上生成点 4.在图片上画线 5.在图片在画圆 6.在图片在写文本 7.在图片在生成指定字体的文本 代码奉上 #!/u ...
- matlab练习程序（点云密度）
算法思路是首先建立kd树,然后找到每个点距离最近的点的距离,对距离求和再求平均即可. 代码如下: clear all; close all; clc; pc = pcread('rabbit.pcd' ...
- Codeforces Round #594 (Div. 2) B. Grow The Tree 水题
B. Grow The Tree Gardener Alexey teaches competitive programming to high school students. To congrat ...
- Note | 用Hugo搭建博客并部署到GitHub Pages
目录 1. 本地搭建 1.1 安装Hugo 1.2 创建站点 1.3 新建页面和文章 1.4 使用主题 1.5 修改配置文件 1.6 预览 2. 部署 之前担心过现有博客平台(如博客园,CSDN)突然 ...
- Hbase内存磁盘大致关系
转自: https://blog.csdn.net/wuwenxiang91322/article/details/51595771 Hbase内存磁盘关系磁盘数 diskNum磁盘容量 diskCa ...
- @Transactional什么情况才生效
只有runtimeexception并且没有被try catch处理的异常才会回滚. 想要回滚,不要去try 还有一个坑时逻辑上的问题,之前总以为插入,更新后,返回值为0,@Transactional ...
- git报错：fatal: bad config line 1 in file C:/Users/JIANGXIAOLIANG/.gitconfig
在给git设置用户名和邮箱的时候报下面的错误:fatal: bad config line 1 in file C:/Users/JIANGXIAOLIANG/.gitconfig看提示的意思是git ...