35.解决elementUI里el-tag遍历数据错误的问题

前言：

所参与的项目里，有个编辑页面是通过点击按钮能出现一个弹框，展示这个编辑项的所有值，可以实现选中几个，编辑项后就会展示几个，如下图。所用到的标签有el-tag（用来遍历选中的所有值）和el-checkbox-group标签（用来展示所有值）

如上图所示，左边框就是el-tag标签，用来展示你已经选择的值，右边框是el-checkbox-group标签，用来展示这一项所有的值：

    {{tag}}
    点击选择

    全选
    
        {{item}}
    
    

        关 闭
    

不论是左边需要遍历展示的值，还是右边需要选中然后绑定到左边的值，他们标签上v-model绑定的都是和编辑页面其他编辑项不一致的（其他都是addForm.xxx），由于一些不可抗原因，将主机组名称对应的字段名单独在data又定义了一遍。

这就导致当选择好提交，修改成功之后，再次打开编辑框，会发现之前选中的没有展示出来，原因是：我绑定的不是addForm.zbx_group_name，而提交的时候是这个，所以每次打开还需要重新获取一下zbx_group_name：

而且这时候要注意，因为是多选，所以当选中之后，给后台传过去的是一串字符串，每次监听得到的也是字符串，这时候，如果在el-tag上遍历字符串，那就会把几个长单词分割成很多字母，就不符合逻辑了，所以，如上图，在获取zbx_group_name时，需要用split方法，通过逗号分隔成数组，这样el-tag再去遍历就会把选中的几个长单词独立展示出来了。