Vue中的双击事件 @dblclick=" " v-on:dblclick=" "

目的：双击按钮显示相应内容

1. @dblclick=“事件名”

html部分代码如下所示：

<button class="btn btn-default" data-toggle="modal"  @dblclick="copyText()">登录</button>
<div  id="modalget">
</div>

js部分代码如下所示：

data: function(){
    return{
      
    }  
},
methods:{
    copyText:function(){
        $("#modalget").modal("show"); //显示模态框的内容
        $("#modalget").show();//指定部分内容显示
    }
},

2. v-on:dblclick="事件名 "

<button class="btn btn-default"  v-on:dblclick="reduce" >登录</button>
<div  id="modalget">
</div>

js部分代码如下所示：

data: function(){
   return{
       
     }  
},
 methods:{
    reduce:function(){
        $("#modalget").modal("show"); 
    },
 },

注意：
$("#modalget").show();//指定部分内容显示
$("#modalget").hide();//指定部分内容隐藏
在使用bootstrap框架时：
$("#modalget").modal("show"); //显示模态框的内容
$("#modalget").modal("hide"); 隐藏模态框的内容