el-select可以新建条目时 限制输入字数

一.el-select新建条目需要设置allow-create和filterable
二.限制字数分为两种三种情况来说明
1.页面中仅有一个el-select

<el-select
    id="inputSubjectId"
    v-model="subject"
    placeholder="请选择"
    filterable
    allow-create
    :filter-method="inputSubjectLimit()"
>
  <el-option
      v-for="item in subjectOption"
      :key="item.name"
      :label="item.name"
      :value="item.name"
  ></el-option>
</el-select>

/* data中定义 */
subject: '',
subjectOption: [
	{ name: '哈哈' },
	{ name: '嘻嘻' }
]
/* methods中定义 */
// 新建科目输入限制
inputSubjectLimit() {
    var inputSubjectId = document.querySelector('#inputSubjectId')
    if (inputSubjectId) {
        inputSubjectId.setAttribute('maxLength', 6)
    }
}

2.el-select在动态加载的组件中

<el-select
   :id="`inputTypeId${index}`"
    v-model="item.type"
    placeholder="请选择"
    filterable
    allow-create
    :filter-method="$event => inputTypeLimit($event, index)"
>
  <el-option
      v-for="ele in applyOption"
      :key="ele.name"
      :label="ele.name"
      :value="ele.name"
  ></el-option>
</el-select>

// 新建报名类型输入限制
inputTypeLimit(event, index) {
    var inputTypeId = document.querySelector(`#inputTypeId${index}`)
    if (inputTypeId) {
        inputTypeId.setAttribute('maxLength', 6)
    }
}

3.在el-table中，而且通过某个操作表格中的数据会新增

<el-table-column
    align="left"
    label="科目"
    fixed
    min-width="120"
>
  <template slot-scope="row">
    <div class="comDefaultSelect courseSelect" @click.stop="">
      <el-select
          :id="`addInputId${row.$index}`"
          v-model="row.row.subject"
          placeholder="请选择"
          filterable
          allow-create
          :filter-method="addInputLimit(row.$index)"
      >
        <el-option
            v-for="item in subjectOption"
            :key="item.name"
            :label="item.name"
            :value="item.name"
        ></el-option>
      </el-select>
    </div>
  </template>
</el-table-column>

// 新建科目输入限制
addInputLimit(index) {
     var addInputId = document.querySelector(`#addInputId${index}`)
     if (addInputId) {
         addInputId.setAttribute('maxLength', 6)
     }
 }

以上，第一次加载的表格数据 科目的下拉框输入有限制。但是，如果点击导入，表格中新增的数据的科目下拉框是没有输入限制的，需要强制刷新此页面。
刷新页面的两种常用方法：
①强制刷新（跟按F5类似，用户体验不好）

location.reload()

this.$router.go(0)

②provide / inject声明注入法




以上，各种情况下，el-select可创建条目的输入限制字数的功能均已实现。
在APP.vue中注入provide/reject会影响其他页面的缓存，可以直接在需要重新加载的表格设置一个变量控制显隐。