"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. 如何在python中使用Elasticsearch

    什么是 Elasticsearch ​ 想查数据就免不了搜索,搜索就离不开搜索引擎,百度.谷歌都是一个非常庞大复杂的搜索引擎,他们几乎索引了互联网上开放的所有网页和数据.然而对于我们自己的业务数据来说 ...

  2. vue框架学习笔记(vue入门篇)

    vue框架 - 构建用户界面的渐进式框架 - 采用自底层向上增量开发的设计 - 核心库只关注视图层 - 当与单文件组件和vue生态系统支持的库结合使用时,也完全能够为复杂的单页应用程序提供驱动 - v ...

  3. 【转】MyBatis缓存机制

    转载:https://blog.csdn.net/bjweimengshu/article/details/79988252. 本文转载自公众号 美团技术点评 前言 MyBatis是常见的Java数据 ...

  4. Windows许可证 即将过期

    最近打开电脑,系统总是自动弹出Windows许可证即将过期的弹窗,现在总结方法如下. 命令都是在运行窗口输入的打开方式:win+R组合键或者右键点击win10开始菜单,点击“运行”查看系统版本:win ...

  5. win7和win10自带桌面便签哪里找

    一些小伙伴习惯使用windows自带的便签功能,但win7和win10区别较大, 导致更新系统后不知道在哪里找,甚至以为没有该功能了, 其实不然,下面我总结了2种方法,希望能帮到有需要的人 win7( ...

  6. Percona Monitoring and Management (PMM) - 快速入门

    前言 数据库监控工具最常用的就是zabbix了,zabbix能将收集到的数据通过图表展示出来,并通过设置阈值及时告警.可zabbix对于文本的处理就不行了,比方说抓取数据库运行的sql,这个zabbi ...

  7. oracle学习笔记（十六） PL/SQL 异常和goto语句

    PL/SQL 异常和goto语句 异常 预定义异常 oracle常见预定义异常: 错误号 异常错误信息名称 说明 ORA-0001 DUP_VAL_ON_INDEX 试图破坏一个唯一性限制 ORA-0 ...

  8. hash算法原理及应用漫谈【加图版】

    原文:https://blog.csdn.net/Tencent_TEG/article/details/103021226 提到hash,相信大多数同学都不会陌生,之前很火现在也依旧很火的技术区块链 ...

  9. Python中全局变量的引用与修改之格式影响

    先来看下面的代码及执行结果: a = 1 b = [2,3] def nums(): a = 2 b[0] = 0 print(a) print(b) print(a) print(b) nums() ...

  10. 关于GC(下)：CMS和G1GC的比较

    简称 STW -- Stop the World,暂停所有在执行的线程 简史 2004年Sun实验室第一次发表G1论文 JDK6U14中第一次作为实验选项引入 JDK7中开始作为替换CMS的方案 JD ...