1.html部分
<template>
<div class="about">
<h1>拖拽demo</h1>
<p id="drag"></p>
</div>
</template>
2.js部分
<script lang="ts">
import { reactive, toRefs, onMounted } from "vue";
export default {
name: "about",
setup() {
const data = reactive({});
onMounted(() => {
const el = document.getElementById("drag");
useMove(el);
});
const datas = toRefs(data);
return {
...datas,
};
// 可拖拽组件:pc和Mobile
function useMove(el: any) {
el.style.position = 'fixed';
let offsetX: number, offsetY: number, oL: number, oT: number, oLeft: number, oTop: number;
const browser = {
versions: function () {
const u = navigator.userAgent;
return {
mobile: !!u.match(/AppleWebKit.*Mobile.*/)