"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. maven clean插件使用进阶

    maven clean插件使用进阶 参考 Maven clean 插件 Maven删除外部文件 查看命令帮助 mvn clean:help mvn clean:help -Ddetail=true - ...

  2. 加速自己的hexo，使用GitHub+Coding实现国内外网站加速

    在配置好hexo之后,我们发现访问网站很慢,但又不是我们使用的主题的问题,那么就是网络环境的影响,即使我们使用了CDN加速,但还是没有我们国内的网站访问起来快速,(听说去美国的服务器要经过太平洋下面的 ...

  3. Eclipse优化之设置不自动弹出控制台和Server

    有时候Eclipse启动,控制台console不会自动跳出来,需要手工点击该选项卡才行, 按下面的设置,可以让它自动跳出来(或不跳出来): windows  ->   preferences   ...

  4. 我说精通字符串，面试官竟然问我 Java 中的 String 有没有长度限制？

    String 是 Java 中很重要的一个数据类型,除了基本数据类型以外,String 是被使用的最广泛的了,但是,关于 String,其实还是有很多东西容易被忽略的. 就如本文我们要讨论的问题:Ja ...

  5. IT兄弟连 Java语法教程 数据类型转换

    类型转换是将一个值从一种类型更改为另一种类型的过程.例如,可以将String(字符串,字符串是Java中非常特殊的数据类型,字符串属于引用类型,但是可以像基本类型一样使用字面值赋值)类型数据“456” ...

  6. 【趣学程序】Linux上安装Tengine（Nginx）

    linux 安装tengine tengine是什么 tengine是由淘宝网发起的Web服务器项目.它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性.Tengine的性能和稳 ...

  7. String与StringBuilder性能比对

    //String与StringBuilder性能比对package seday01;/** * String修改字符串带来的性能开销 * @author xingsir * */public clas ...

  8. JAVA的基本语法1

    1.关键字 关键字的定义和特点 定义:被JAVA语言赋予了特殊含义,用作专门用途的字符串(单词). 就是在java语言编程的时候,在关键的地方使用的单词,体现关键的地方的含义.这些单词都是特有的,并且 ...

  9. django7-cookie与session

    1.有状态服务与无状态服务 服务实例存储了客户端的数据 ,那么这就是个有状态服务 服务实例不存储客户端数据 ,让其他缓存存储客户端数据 ,这就是无状态服务 ,http就是无状态的 2.什么是cooki ...

  10. Docker基础概念与安装

    Docker是什么? Docker最初是dotCloud公司的创始人Solomon Hyks在法国期间发起的一个公司内部项目,它是基于dotCloud公司多年云服务技术的一次革新,并于2013年3月以 ...