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

前端使用vue，项目中使用的是element ui组件，在使用select下拉框多选时，新增记录时select多选下拉框正常使用，没问题。但是在编辑记录时，编辑界面也为select下拉框赋值了，却没有显示数据。
先放一个select多选下拉框编辑时正确的加载数据的显示效果图：

下拉框代码如下：

1. <el-form-item label="设备属性" prop="setId">

2. <el-select v-model="dataForm.setId" multiple class="filter-item" placeholder="请选择设备属性" >

3. <el-option v-for="item in deviceTypeOptions" :key="item.deviceTypeId" :label="item.deviceTypeName" :value="item.deviceTypeId" />

4. </el-select>

5. </el-form-item>

将后端返回的字符串在转换成数组时，转换成整形数组，下拉框即可正确显示。
代码如下：

1. // 显示编辑界面

2. handleEdit: function (row) {

3. this.editDialogVisible = true

4. this.operation = false

5. this.dataForm = Object.assign({}, row)

6.  

7. var arrIntSet = []

8. if(null!=row.setId&&""!=row.setId){

9. // 将字符串转换成数组，此时是字符串数组

10. var arrString = row.setId.split(',')

11. // 将字符串数组的每一项转换成Number，生成一个新的数组

12. for (var arrInt in arrString) {

13. arrIntSet.push(parseInt(arrString[arrInt]))

14. }

15. }

16. // 将新的Number数组，绑定到select空间的v-model上

17. this.dataForm.setId = arrIntSet

18. }

数据保存传值到后台，代码如下：

1. submitForm: function () {

2. this.$refs.dataForm.validate((valid) => {

3. if (valid) {

4. this.$confirm('确认提交吗？', '提示', {}).then(() => {

5. this.editLoading = true

6.  

7. //多选框数据处理

8. let s = []

9. for(var i = 0; i < this.dataForm.setId.length; i++) {

10. s.push(this.dataForm.setId[i])

11. }

12.  

13. this.dataForm.setId = s.join()

14.  

15. let params = Object.assign({}, this.dataForm)

16. saveOrUpdate(params).then((res) => {

17. if(res.code == 20000) {

18. this.$message({ message: '操作成功', type: 'success' })

19. } else {

20. this.$message({message: '操作失败, ' + res.msg, type: 'error'})

21. }

22. this.editLoading = false

23. this.$refs['dataForm'].resetFields()

24. this.editDialogVisible = false

25. this.findPage()

26. })

27. })

28. }

29. })

30. },