Javascript Vuejs计算阵列

我有一系列帐户状态，如[“AS”，“AS”] 我有一张这样的桌子 [！[在此处输入图像描述][1][1]

  [1]: https://i.stack.imgur.com/2EiPn.png

我需要在此表中添加帐户状态和其他字段，如下所示

这是我的密码

`   <template slot="thead" >
              <!-- <vs-th>Image</vs-th> -->
              <vs-th sort-key="First Name">First Name</vs-th>
              <vs-th sort-key="Last Name">Last Name</vs-th>
              <vs-th sort-key="Phone Number">Phone Number</vs-th>
              <vs-th sort-key="Account Status">Account Status</vs-th>
              <vs-th sort-key="User Balance">User Balance</vs-th>
              <vs-th>Action</vs-th>
            </template>

            <template slot-scope="{ data }">
              <tbody>
                <vs-tr :data="tr" :key="indextr" v-for="(tr, indextr) in data" >

                  <!-- <vs-td class="img-container">
              <img :src=" baseURL + tr.ImagePathUrl" class="product-img"  v-if="tr.ImagePathUrl != null"/>
              <img :src=" defaultUrl" class="product-img"  v-else/>
            </vs-td> -->
                  <vs-td>
                    <p class="product-name font-medium truncate">
                      {{ tr.firstName }}
                    </p>
                  </vs-td>
                  <vs-td>
                    <p class="product-category">{{ tr.lastName }}</p>
                  </vs-td>
                  <vs-td>
                    <p class="product-category">{{ tr.PhoneNumber }}</p>
                  </vs-td>

                  <vs-td >

                    <vs-chip class="product-order-status" >  ACCOUNT STATUS </vs-chip>
                  </vs-td>

                  <vs-td>
                    <p class="product-category">
                      {{ tr.UserBalance | numFormat("###,##0.00") }}
                    </p>
                  </vs-td>

                  <vs-td class="whitespace-no-wrap">
                    <!-- <router-link :to="{name: 'Client-add/Edit', params: { data:{ Id: tr.Id , CountryCode: tr.CountryCode ,PhoneNumber: tr.PhoneNumber}}}" svgClasses="w-5 h-5 hover:text-primary stroke-current">
                    <feather-icon icon="EditIcon" svgClasses="w-5 h-5 hover:text-primary stroke-current" style="padding:2px" />
                </router-link> -->

                    <router-link
                      :to="{ name: 'ClientProfile', params: { Id: tr.Id } }"
                    >
                      <feather-icon
                        icon="UserIcon"
                        svgClasses="w-5 h-5 hover:text-primary stroke-current"
                        style="padding:2px"
                      />
                    </router-link>
                  </vs-td>
                </vs-tr>
              </tbody>
            </template>

this is my computed method to get Accounts List


    computed: {

    KeyToValAccountStatus(){
      debugger
          this.ListAccountStatus();

       return this.AccountStatus
      },

`

`
名字
姓
电话号码
帐户状态
用户余额
行动

{{tr.firstName}

{{tr.lastName}
{{tr.PhoneNumber}
帐户状态

{{tr.UserBalance | numFormat（######,###0.00”）}

这是我获取帐户列表的计算方法
计算：{
KeyToValAccountStatus（）{
调试器
这是.ListAccountStatus（）；
返回此帐户状态
},
`

AccountStatus返回帐户状态数组 我需要将它们打印在表中的那个位置

---

我尝试将我的computed放入表中，它打印表中每个字段的所有值

使用数据和方法，如果变量未用于交互，则不使用computed（按钮禁用，简单计算）