vue 利用css实现元素扩大鼠标选中区域及音乐拖动进度条实现（初版）

效果图如下：

 html部分

js部分：

data() {
      return {
        wid: 100,
        heig: 4,
        isdown: false,
      }
    },

 methods: { // 方法 集合

      clickD(e) {
        console.log(e);
        // console.log(e.currentTarget.firstElementChild);
        this.wid = e.layerX;
        // e.currentTarget.firstElementChild.style.width = e.layerX;
        // console.log(e.currentTarget.firstElementChild[0].style.width)
      },

      down(e) {
        this.isdown = true;
      },

      mouse(e) {
        if (this.isdown) {
          console.log(e);
          console.log(e.layerX);
          this.wid = e.layerX;
        }
      },
      mouseupC(e) {
        this.isdown = false;
      },

      mouseLeaveF(e) {
        this.isdown = false;
      },

      mouseOverF(e) {
        console.log(this);
        console.log(e.path);
      }
}

css：