在input框光标处插入内容

<template>
	<div>
		<input type="text" v-model="inputVal" ref="inputEl" />
		<button @click="insertText">插入文本</button>
	</div>
</template>

<script>
export default {
	data() {
		return {
			inputVal: "",
		};
	},
	methods: {
		insertText() {
			// 获取 input 元素
			const inputEl = this.$refs.inputEl;

			// 获取光标当前位置
			const start = inputEl.selectionStart;
			const end = inputEl.selectionEnd;

			// 在光标位置插入文本
			const textToInsert = "插入的文本";
			this.inputVal =
				this.inputVal.slice(0, start) +
				textToInsert +
				this.inputVal.slice(end);
		},
	},
};
</script>