vue inpute textarea 支持录入tab键，以及在input光标后追加内容

遇到一个需求
需要在textarea中支持tab键的输入

但是在浏览器中，默认tab键是自动聚焦在下一个可以聚焦的元素上
思路如下：
input中接收到tab键时，阻止默认事件
在input中获取到光标位置，在后面加一个 \t 制表符
input获取焦点

代码如下

<el-form-item label="活动名称">
  <el-input
    id="myinput"
    type="textarea"
    v-model="form.content"
    :autosize="{minRows:9,maxRows:9}"
    @keydown.9.native.prevent="tabFunc"
    ref="inputVal"></el-input>
</el-form-item>

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()
    elInput.selectionStart = startPos + insertTxt.length
    elInput.selectionEnd = startPos + insertTxt.length
},
tabFunc () {
    console.log(111)
    this.insertInputTxt('myinput', '\t')
},

insertInputTxt 参考了
https://segmentfault.com/q/1010000017101606/a-1020000017103333
感谢