<template>
<a-input
id="myinput"
type="textarea"
v-model:value="demotext"
:autosize="{ minRows: 9, maxRows: 9 }"
@blur="tabFunc"
ref="inputVal"
></a-input>
<a-button @click="changetext('aa')">点击切换</a-button>
</template>
<script setup name="demo">
import { ref, nextTick} from "vue";
const demotext = ref('123456789');
const insertInputTxt = (id, insertTxt) => {
var elInput = document.getElementById(id);
var startPos = elInput.selectionStart;
var endPos = elInput.selectionEnd;
if (startPos === undefined || endPos === undefined) return;
var txt = elInput.value;
var result = txt.substring(0, startPos) + insertTxt + txt.substring(endPos);
elInput.value = result;
// elInput.focus()
// nextTick(() => {
elInput.selectionStart = startPos + insertTxt.length;
elInput.selectionEnd = startPos + insertTxt.length;
demotext.value = elInput.value;
console.log(demotext.value);
// })
};
const changetext = () => {
console.log(111);
nextTick(() => {
insertInputTxt("myinput", "a");
})
};
</script>
vue 获取input中光标位置,并且点击按钮在当前光标位置追加内容
最新推荐文章于 2024-07-17 14:47:00 发布