vue3 + TS 修改光标位置

要修改Vue3+TS中的光标位置，可以通过在模板中使用ref来获取对应的DOM元素，然后在Vue组件的methods中使用相应的DOM API来设置光标位置。

例如，如果想要在一个输入框中将光标位置设置到输入框的末尾，可以在模板中使用ref来获取对应的输入框元素：

<template>
  <div>
    <input ref="input" type="text" v-model="text" />
  </div>
</template>

然后在Vue组件的methods中使用DOM API来设置光标位置：

import { ref } from 'vue';

export default {
  setup() {
    const inputRef = ref<HTMLInputElement | null>(null);
    const text = ref('');

    function setText() {
      if (inputRef.value) {
        inputRef.value.selectionStart = inputRef.value.value.length;
        inputRef.value.selectionEnd = inputRef.value.value.length;
        inputRef.value.focus();
      }
    }

    return {
      inputRef,
      text,
      setText,
    };
  },
};

在上面的例子中，我们通过ref获取了输入框元素的引用，并定义了一个`setText`方法来设置光标位置。在`setText`方法中，我们首先判断`inputRef.value`是否存在，如果存在则使用`selectionStart`和`selectionEnd`属性来将光标位置设置到输入框的末尾，然后使用`focus`方法来使输入框获得焦点。

最后，我们可以在需要设置光标位置的时候调用`setText`方法即可。