zoukankan      html  css  js  c++  java
  • vue在光标的位置插入内容

    一,在textarea中加入id

     <el-form-item :label="$t('message_template_content')" prop="content">
              <el-input
                type="textarea"
                id="textarea"
                :autosize="{ minRows: 5, maxRows: 10}"
                :placeholder="$t('common_input')"
                v-model="messageTemplate.content"
              />
            </el-form-item>

    二、在methods中写入方法

    async insertVariable(value) {
          const myField = document.querySelector('#textarea');
          // const myField = this.$refs.singleText;
          console.log('myField--',myField);
          if(myField.selectionStart || myField.selectionStart === 0) {
            let startPos = myField.selectionStart;
            let endPos = myField.selectionEnd;
            this.messageTemplate.content = myField.value.substring(0, startPos) + value
                        + myField.value.substring(endPos, myField.value.length);
            await this.$nextTick() // 这句是重点, 圈起来
            myField.focus();
            myField.setSelectionRange(endPos + value.length, endPos + value.length);
          } else {
            this.messageTemplate.content = value;
          }
        },
    

      

  • 相关阅读:
    [THREEJS]坐标高精度问题
    纹理的寻址方式
    [1009]JS语言精髓与编程实践笔记1
    万向锁
    (转)primitive restarting
    西藏游记
    平衡二叉树(AVL tree)
    初探redis事务
    redis发布与订阅
    初探redis分布式锁
  • 原文地址:https://www.cnblogs.com/tanweiwei/p/13847926.html
Copyright © 2011-2022 走看看