VUE textarea ≈ contenteditable="true"

<div class="textareaWrap">
    <div @input="textareaEnter($event)" v-html="routerParam.desc"
            class="textarea" contenteditable="true" placeholder="XXXX">
    </div>
</div>

// textarea输入控制
textareaEnter(e) {
    const val = e.target.innerHTML
    if (val.length <= 10) {
        this.form.desc = e.target.innerHTML
    } else {
        e.target.innerHTML = this.form.desc
        this.$message.error('不能超过10个字哦')
    }
},

.textareaWrap{
    position:relative;
    width:680px*@scale; height:180px*@scale; margin:5px auto 0; border-bottom:2px solid @main;
    .textarea{
        position:absolute; bottom:0; left:0; overflow-x:hidden; overflow-y:auto; overflow:-moz-scrollbars-none;
        max-height:150px*@scale; border:0 none; padding:5px 0;
        font-size:34px*@scale; color:#7C8B9C;word-break:break-all;
        -webkit-user-select:text; word-wrap:break-word; letter-spacing:0;
        &::-webkit-scrollbar{
            display:none;
        }
        &:empty:before{
            font-size:34px*@scale; content:attr(placeholder); letter-spacing:0; text-align:justify; color:@placeholder;
        }
        &:focus{
            content:none; outline:none;
        }
    }
}

[学习来源_textarea如何实现高度自适应](https://juejin.im/post/5d32c5d16fb9a07f04208316)

contenteditable="true"光标focus

    focusTextarea() {
        const e = document.getElementById('textarea'),
          s = window.getSelection(),
          r = document.createRange()
        e.focus()
        r.selectNodeContents(e)
        r.collapse(false)
        s.removeAllRanges()
        s.addRange(r)
    },

    <div class="textareaWrap" @click="focusTextarea">
        <div id="textarea" @input="textareaEnter($event)" v-html="routerParam.desc"
            class="textarea" contenteditable="true" :placeholder="form.oIndustry.desc">
        </div>
    </div>

   [学习来源_div contenteditable重新编辑时focus光标定位到前面问题解决]
       (https://blog.csdn.net/weixin_30483013/article/details/97912452)
   [学习来源_Set focus on div contenteditable element]
       (https://stackoverflow.com/questions/2388164/set-focus-on-div-contenteditable-element)

思考

- 无法选中
- 光标一直在最后