vue-drag-resize实现页面的拖拽与缩放(解决为何不能缩放

用法:

注意VueDragResize的w属性和h属性必须有值

<template>
  <!--//需要给VueDragResize套一个div-->
  <div id="app">
    <!--//缩放功能主要是缩放VueDrangResize标签-->
    <VueDragResize :isActive="true" :w="200" :h="200" v-on:resizing="resize" v-on:dragging="resize">
      <!-- 图片缩放 -->
      <!--将这个div的宽高动态设置==VueDrangResize的宽高这样可实时完成缩放-->
      <div class="box" :style="{width: + vw+ 'px',height:+vh+'px'}"><!--我这写的是本地的图片,图片可以动态获取-->
        <img src="../assets/logo.png" style="width: 100%;height: 100%"></div>
    </VueDragResize>
    <div>
      <h3>Hello World!</h3>
      <p>{
  { vw }} х {
  {
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值