原理:获取鼠标点击的位置,动态地给div框赋top和left值

1.给元素绑定动态样式style

<div class="dialog_wrapper" v-bind:style="styleObject"></div>

2.在data中绑定div的style

  data() {
    return {
      styleObject: {
        top: '0',
        left: '0'
      },
    };
  },

3.获取鼠标点击的位置,并赋值给div

   getPosition (event) {
      let x = event.pageX
      let y = event.pageY
      this.styleObject.left = (x) + 'px'
      this.styleObject.top = (y) + 'px'
    },

 

Logo

前往低代码交流专区

更多推荐