vue自由拖拽、縮放組件


github地址:https://github.com/kirillmurashov/vue-drag-resize

 

安裝:

npm i -s vue-drag-resize

 

 

使用:

 

<template>
  <div>
    <VueDragResize :isActive="true"  :isResizable="false" >
      <img src="../assets/logo.png" v-drag height="100px" width="100px" />
    </VueDragResize>
  </div>
</template>

<style>
.vdr.active:before{
  outline: none
}
</style>
    
<script>
import VueDragResize from "vue-drag-resize";
export default {
  components: {
    VueDragResize
  },
  data() {
    return {};
  },
  methods: {},
  mounted() {
    
  }
};
</script>
:isResizable="false":不支持縮放,只支持拖拽
outline: none:去除拖拽組件的邊框

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM