<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <!--<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->

    <script type="text/javascript" src="../js/vue.js"></script>

</head>

<body>

<div id="hdcms">

    <li v-for="(v,k) in comments">

        {{v.id}} - {{v.content}}

        <button v-on:click="abc(v.id)">v-on单击事件</button>

        <button @click="abc(v.id)">@单击事件</button><!--@和上面的v-on效果是一样的-->

        <button @dblclick="abc(v.id)">@dblclick双击事件</button><!--@和上面的v-on效果是一样的-->

    </li>

</div>

<script>

    var app = new Vue({

        el: '#hdcms',

        data: {

            //当前用户输入内容

            comments: [

                {id: 2, content: 'HDPHP'},

                {id: 4, content: 'HDCMS'},

                {id: 1, content: '后盾人'},

                {id: 3, content: '向军老师'},

            ]

        },

        methods: {

            abc(k){

                console.log(k);

            },

        }

    });

</script>

</body>

</html>

效果:

25.VUE学习之-单击和双击事件的更多相关文章

  1. JS - 解决鼠标单击、双击事件冲突问题（原生js实现）

    由于鼠标双击时每一次触发双击事件都会引起两次单击事件和一次单击事件,原生的js不提供专门的双击事件. 因为业务原因,双击和单机都绑定了不同的业务,在双击的时候又触发了单机,影响了页面的正常显示 出现问 ...

  2. [转] Ext Grid （ExtJs）上的单击以及双击事件

    例1: 1.双击 var cb = new Ext.grid.RowSelectionModel({ singleSelect:true //如果值是false,表明可以选择多行:否则只能选择一行 } ...

  3. GridView/DataGrid行单击和双击事件实现代码_.Net教程

    功能: 单击选中行,双击打开详细页面 说明:单击事件(onclick)使用了 setTimeout 延迟,根据实际需要修改延迟时间 ;当双击时,通过全局变量 dbl_click 来取消单击事件的响应  ...

  4. 禁用CMFCRibbonApplicationButton的单击和双击事件

    为了禁用CMFCRibbonApplicationButton的单击和双击事件,我重载了CMFCRibbonApplicationButton如下: 1. MyRibbonApplicationBut ...

  5. jquery处理单击和双击事件

    今天做div点击时,需要用到同一div的单击和双击事件,出现问题如下 例子: Html <body> <div id="div_1">单击双击我</d ...

  6. Android 自定义View实现单击和双击事件

    自定义View, 1. 自定义一个Runnable线程TouchEventCountThread ,  用来统计500ms内的点击次数 2. 在MyView中的 onTouchEvent 中调用 上面 ...

  7. 支持行单击、双击事件的GridView和DataList控件（译）

    支持行单击.双击事件的GridView和DataList控件(译)         让GridView 和 DataList 控件响应鼠标单击.双击事件.并且,使用 ClientScript.Regi ...

  8. [Javasript] 同时实现单击和双击事件

    在同一个元素上同时绑定单击和双击事件: JavaScript <script type="text/javascript"> var timer = 0; var de ...

  9. unity3D 游戏物体同时绑定单击、双击事件

    前言 在unity中我们常用的获取鼠标点击的方法有 在3D场景中,一般用在Update方法中,每一帧调用 void Update(){ )){ Debug.log("鼠标左键点击" ...

随机推荐

  1. Gym 101047K Training with Phuket's larvae

    http://codeforces.com/gym/101047/problem/K 题目:给定n<=2000条绳子,要你找出其中三条,围成三角形,并且要使得围成的三角形面积最小 思路: 考虑一 ...

  2. Python踩坑之旅其一杀不死的Shell子进程

    目录 1.1 踩坑案例 1.2 填坑解法 1.3 坑位分析 1.4 坑后扩展 1.4.1 扩展知识 1.4.1 技术关键字 1.5 填坑总结 1.1 踩坑案例 踩坑的程序是个常驻的Agent类管理进程 ...

  3. PIO导出

    1..HSSFWorkbook 声明一个工作簿,创建一个excel文件 //创建HSSFWork对象(excel的文档对象) HSSFWorkbook wb=new HSSFWorkbook(); / ...

  4. cd进入相关目录的命令

    今天不记得怎么进入Linux的根目录了,查询了下顺便复习下其他命令: 1.[root@localhost]#cd /usr 切换至根目录下的文件夹要加"/" 2.[root@loc ...

  5. Educational Codeforces Round 51 (Rated for Div. 2)

    做了四个题.. A. Vasya And Password 直接特判即可,,为啥泥萌都说难写,,,, 这个子串实际上是忽悠人的,因为每次改一个字符就可以 我靠我居然被hack了???? %……& ...

  6. 【Android车载系统 News | Tech 5】车载设计开发

    1. 基于Android的车载移动终端系统的研究与开发 http://wenku.baidu.com/link?url=hIKlQ2myEmR8N0CA28a_SLzLA2Q9R5Xpk20OJ53h ...

  7. LAMP stack-5.6.22 (OpenLogic CentOS 7.2)

    平台: CentOS 类型: 虚拟机镜像 软件包: apache2.4.20 mysql5.6.30 php5.6.22 apache application server basic softwar ...

  8. hihoCoder 挑战赛10 #1144 : 01串

    思路:这只是逻辑测试题吧,考虑周全就行了.考虑n=m的情况,n>m的情况,m>n的情况. (1)n>m的情况,0比1多几个都是行的,一共有m个“01”,后面补足够多个零即可. (2) ...

  9. tomcat 启动显示指定的服务未安装

    解决方法: 命令行进入tomcat的bin目录 输入“service.bat install” 重启,OK

  10. lsscsi 与 cat /proc/scsi/scsi

    [root@localhost ~]# lsscsi[0:0:0:0]    disk    SEAGATE  ST300MM0048      N001  /dev/sda [0:0:2:0]    ...