如何从获取的嵌套数组中删除括号

Question

你们好。我可以寻求你的帮助吗？我一直在弄清楚如何摆脱括号并将每个数据从我的嵌套数组中分离出来。这是我的代码：

<template>
  <v-data-table
    :headers="headers"
    :items="teams"
  >
    <template v-slot:body="{ items }">
      <tbody>
        <tr v-for="item in items" :key="item.id">
          <td>{{ item.id }}</td>
          <td>{{ item.name }}</td>
          <td>{{ item.business_Units }}</td>
          <td>
            <v-icon small class="mr-2" @click="editRole(item)">
              mdi-pencil
            </v-icon>
          </td>
          <td>{{ item.status | boolean }}</td>
        </tr>
      </tbody>
    </template>
  </v-data-table>
</template>
<script>
export default {
//..... chunk of my code on how to request from the api
  created() {
    SparrowService.getTeams()
      .then((response) => {
        this.loading = false;
        this.teams = response.data;
      })
      .catch((error) => {
        console.log(error.response);
      });
  },
};
</script>

Answer 1

item.business_Units是数组，所以你需要采取一些行动来加入字符串。

参考Array.join()

...
       <td>{{ item.business_Units.join(", ") }}</td>
...

如何从获取的嵌套数组中删除括号

How to get rid of the Brackets from fetched Nested Array

vue.js

vuejs2

vuetify.js

vue-data-tables