vue开发中列表中接口会返回id拼接的字符串，但是我们需要将这些id转为他们对应的标题拼接，通过逗号分割的字符串换取，逗号分割的name，记录一下方便后期复用。

处理前

0,1

处理后

现场领取,发送电子档

使用

<template slot-scope="scope">
            <typeNameList :type="scope.row.scopes"></typeNameList>
</template>

代码

/**
* @Author: 858834013@qq.com
* @Name: typeNameList
* @Date: 2022-03-21
* @Desc:
*/
<template>
  <div>
    {{ typeName }}
  </div>
</template>

<script>
export default {
  name: 'typeNameList',
  components: {},
  props: {
    type: {
      type: String | Number,
      default() {
        return ''
      }
    }
  },
  computed: {
    typeName: function() {
      var name = []
      var nameStr = ''
      if (this.type) {
        var typelist = this.type.split(',')
        typelist.forEach((type2) => {
          this.list.forEach((type) => {
            if (type2 == type.id) {
              name.push(type.title)
            }
          })
        })
        if (name.length > 0) {
          nameStr = name.join(',')
        }
      }
      return nameStr
    }
  },
  data() {
    return {
      list: [{
        id: 0,
        title: '现场领取'
      }, {
        id: 1,
        title: '发送电子档'
      }]
    }
  }
}
</script>

<style lang="scss" scoped>

</style>