Question

这就是我将光标设置在textarea的第一个字符中的方式：

<div class="field">
  <label>Text</label>
  <textarea ref="inputEl">abc</textarea>
</div>

methods: {
  setInitialCursorPosition () {
    const inputEl = this.$refs.inputEl
    inputEl.focus()
    inputEl.setSelectionRange(0, 1)
  }
},

mounted () {
  this.setInitialCursorPosition()
}

我想，虽然在方法之间分享范围。我检查了MDN，他们说你可以创建一个这样的范围：

var range = document.createRange();

range.setStart(startNode, startOffset);
range.setEnd(endNode, endOffset);

然而，这仅创建了一个范围对象...如何将此范围连接到我的textarea并在方法之间共享此范围？

Answer 1

为什么在它只有2个数字时才会使用范围对象。范围对象用于完全不同的东西，并且比您需要或应该使用的东西更复杂。

https://developer.mozilla.org/en-US/docs/Web/API/Range

如果您想在方法之间共享范围，只需在数据对象[0, 1]上设置数组，或者如果您想要更具描述性的内容，请使用具有min和max属性的对象。

data() {
    return {
        range: {
           min: 0,
           max: 1
        }
    };
}

或者只是设置一个数组，任何一个都可以。

如何将创建的范围连接到textarea元素的值？

1 个答案: