解决elementUI select multiple多选下拉框， 赋值和传值到后台处理操作

实现多选下拉框后，表单中的内容不在是字符串的类型，而是变成了数组的类型，点击添加按钮后，会报错的，因为原来该字段的类型是字符串，类型不匹配。 

解决方案：

1. 首先需要在添加事件中处理数据，然后再传给后端

需要将数组类型的数据转为字符串的类型，然后再提交表单，将传递给后端

    let ct = []
    if (this.form.collegeType){
        for (let i=0; i<this.form.collegeType.length; i++) {
           ct.push(this.form.collegeType[i])
        }
        this.form.collegeType =  ct.join("-")   // 通过"-"连接成字符串
        console.log(this.form.collegeType, "this.form.collegeType")   // ?-?
    }

2. 前端处理从后端查询的数据

数据以字符串的形式添加到数据库后，前端需要查询数据，并需要再将字符串类型转为数组类型，便于使用

/* 处理从后端返回前端的学校类型 */
let TypeArr = [];
this.collegeList.forEach((college, index) => {
 if (index >= this.newCollegeTypeArr.length) {
      const arrCollegeTypes = college.collegeType.split("-");
      arrCollegeTypes.forEach(type => {
      TypeArr.push(parseInt(type));
      });
  }
 });
 this.newCollegeTypeArr = TypeArr;
 this.form.collegeType = this.newCollegeTypeArr;
 console.log(this.form.collegeType, "this.newCollegeTypeArr111")

3. 利用数据

我主要是需要遍历数据，将数据以字典中标签的形式展示出来

      <el-table-column label="学校类型" align="center" prop="collegeType" min-width="300%">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.sys_school_type" v-for="(type,index) in scope.row.collegeType" :key="`${index}-${type}`" :value="type"
            :separator="' '"/>
        </template>
      </el-table-column>