"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 事件的基本使用与语法差异的更多相关文章

  1. C#与Java的语法差异

    C#与Java的语法差异C与Java的语法差异前言程序结构基本语法数据类型字符串变量与常量运算符判断语句循环语句访问权限方法数组结构枚举类继承多态运算符重载接口命名空间预处理器指令正则表达式异常IO泛 ...

  2. Vue事件绑定原理

    Vue事件绑定原理 Vue中通过v-on或其语法糖@指令来给元素绑定事件并且提供了事件修饰符,基本流程是进行模板编译生成AST,生成render函数后并执行得到VNode,VNode生成真实DOM节点 ...

  3. Vue的基本使用和模版语法

    Vue的基本使用和模版语法 一.Vue概述 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架 vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目 ...

  4. Sqlite基础及其与SQLServer语法差异

    1 TOP 这是一个大家经常问到的问题,例如在SQLSERVER中可以使用如下语句来取得记录集中的前十条记录: SELECT TOP 10 * FROM [index] ORDER BY indexi ...

  5. vue 2.0 无法编译ES6语法

    # vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...

  6. C++、Java语法差异对照表

    C++.Java语法差异对照表 C++ and Java Syntax Differences Cheat Sheet First, two big things--the main function ...

  7. Kotlin VS Java:基本语法差异

    Kotlin比Java更年轻,但它是一个非常有前途的编程语言,它的社区不断增长. 每个人都在谈论它,并说它很酷. 但为什么这么特别? 我们准备了一系列文章,分享我们在Kotlin开发Android应用 ...

  8. Vue—事件修饰符

    Vue事件修饰符 Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation(). Vue. ...

  9. vue 事件上加阻止冒泡 阻止默认事件

    重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...

随机推荐

  1. 《深度访谈:华为开源数据格式 CarbonData 项目,实现大数据即席查询秒级响应》

    深度访谈:华为开源数据格式 CarbonData 项目,实现大数据即席查询秒级响应   Tina 阅读数:146012016 年 7 月 13 日 19:00   华为宣布开源了 CarbonData ...

  2. SQL查询--关于查询的练习题

    下面的练习题出自LeetCode:https://leetcode-cn.com/problemset/database/,有兴趣的可以去上面刷刷题 练习题1:超过经理收入的员工  分析: 使用sql ...

  3. DirectShow 常用函数总结

    本文准备总结一些 Direct Show 常用的API接口函数,方便以后查询回忆.如果这里没有你想了解的函数,你可以自行搜索MSDN + 函数名去 MSDN 查找你想要了解的函数,也可以查看百度百科相 ...

  4. 《细说PHP》第四版 样章 第18章 数据库抽象层PDO 6

    18.5.3  PDO的错误处理模式 PDO共提供了3种不同的错误处理模式,不仅可以满足不同风格的编程,也可以调整扩展处理错误的方式. 1.PDO::ERRMODE_SILENT 这是默认模式,在错误 ...

  5. PlayJava Day002

    今日所学: /* 2019.08.19开始学习,此为补档. */ 流程控制 条件: 一重用if 二重用if ... else 三重用if ... else if ... else 多重用switch ...

  6. Redis设置密码,保护数据安全

    1.设置密码方法 在 redis.conf 的配置文件中修改参数 requirepass 的值为需要设置的密码, 保存配置文件后,重启Redis就可以. 建议 设置比较复杂和长的密码,防止被暴力破解. ...

  7. PHP fread 文件系统函数

    定义和用法 fread - 读取文件(可安全用于二进制文件) 版本支持 PHP4 PHP5 PHP7 支持 支持 支持 语法 fread ( resource $handle , int $lengt ...

  8. 完美解决linux下vim在终端不能用鼠标复制的问题

    在vim 中输入 :set mouse=r 就行了,还不行的话 :set mouse=v

  9. windows下dubbo-admin2.6.x之后版本的安装

    安装zookeeper(单机) 下载bin.tar.gz的版本,解压 conf下的zoo_sample.cfg改zoo.cfg zoo.cfg里添加配置 dataDir=G:/zookeeper-/d ...

  10. 通过重复运行的Microsoft Flow由OAuth认证后获取Access Token并将其更新到实体记录

    我是微软Dynamcis 365 & Power Platform方面的工程师罗勇,也是2015年7月到2018年6月连续三年Dynamics CRM/Business Solutions方面 ...