Vue实现开关按钮拖拽效果

(编辑：jimmy 日期: 2024/11/7 浏览：3 次 )

本文实例为大家分享了Vue实现开关按钮拖拽效果的具体代码，供大家参考，具体内容如下

css:

<style>
  .box {
    position: absolute;
    left: 100px;
    top: 100px;
    width: 100px;
    height: 100px;
    background: red;
  }
  .box2 {
    position: absolute;
    left: 400px;
    top: 100px;
    width: 100px;
    height: 100px;
    background: green;
  }
</style>

html:

<div id="app">

  <div class="box" v-drag="isDrag"></div>

  <div class="box2" v-drag:fn.limit.b="isDrag"></div>

  <button @click="isDrag = !isDrag">{{isDrag}}</button>

</div>

js:

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

上一篇：浅谈vue websocket nodeJS 进行实时通信踩到的坑
下一篇：JS如何生成动态列表