1. The requirements are as follows
has a textarea tag. You need to get the position of the cursor and insert the specified content according to the position of the cursor.
bind the value of textarea bidirectionally through v-model, and bind the input event by textarea. When you enter textarea, you can trigger the input event, but you cannot trigger the input event by representing the value value through the code, so I added the value value to listen in the watch, so that as soon as the value value changes, the method in the watch can be triggered.
2. Question
as shown above, the cursor position is at the end and does not change the cursor position
the code is as follows:
watch:{
value:function(val, oldval){
this.$refs.input.focus();
this.html = Marked(this.value);
console.log(this.$refs.input.selectionStart); // console
this.$refs.input.focus();
// this.startthis.end
this.$refs.input.selectionStart = this.start + 2;
this.$refs.input.selectionEnd = this.end + 2;
console.log(this.$refs.input.selectionStart); // console 2
}
},
actually changes the value of this.$refs.input.selectionStart, but the cursor position hasn"t changed visually. Why?
in addition, I tried to set the cursor position in a pure html file, which is for the problem, is it the Vue problem? Or is it my code logic problem?