web页面左右拖拽

简单记录一下，下次方便使用

演示

页面左右拖拽

 组件代码

<script setup>
import { ref, computed, defineProps } from 'vue'
const props = defineProps({
  leftMinWidth: {
    type: Number,
    default: 0.15
  },
  rightMinWidth: {
    type: Number,
    default: 0.4
  },
  defaultWidth: {
    type: Number,
    default: 0.2
  }
})
let left_width = ref(props.defaultWidth)
let isMousemouse = ref(false) // 记录鼠标按下还是抬起
let initWidth = ref(0) // 鼠标距离bar容器左侧的距离
let wrapper = ref(null)
let bar = ref(null)
let lwidth = computed(() => {
  return left_width.value * 100 + '%'
})
let bar_wi