Vue3 ref 设置 div 位置：使用 ref 操作 DOM 元素样式

在 Vue3 中，可以使用 'ref' 来创建响应式的引用对象，并通过 'ref' 对象来操作 DOM 元素的属性。

如果要设置一个 div 的位置，可以使用 'ref' 引用对象来获取 DOM 元素，然后通过修改其 style 属性来设置位置。

下面是一个示例：

<template>
  <div ref='myDiv'>这是一个 div</div>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  setup() {
    const myDiv = ref(null);

    onMounted(() => {
      // 在组件挂载后，设置 div 的位置
      myDiv.value.style.position = 'absolute';
      myDiv.value.style.left = '100px';
      myDiv.value.style.top = '200px';
    });

    return {
      myDiv
    };
  }
};
</script>

在上述示例中，我们通过 'ref' 创建了一个名为 'myDiv' 的引用对象，并使用 'ref' 指令将其绑定到了模板中的 <div> 元素上。在 'setup' 函数中，我们通过 'onMounted' 钩子函数，在组件挂载后获取到 'myDiv' 的 DOM 元素，并使用 'style' 属性来设置其位置属性。

注意：需要确保在组件挂载后再进行 DOM 操作，因此使用了 'onMounted' 钩子函数。