vuetify —— v-row 和 v-col的结合使用

<v-card-text>
  <v-row v-for="items in filterExtrl" :key="items.index">
    <v-col v-for="item in items" :key="item.id"
      ><span v-if="item.display_name">{{ item.display_name }}：</span
      ><span
        v-if="item.display_name"
        :style="{
          color: attributes[item.name] || item.default ? '' : '#9195a3'
        }"
        >{{ attributes[item.name] || item.default || "未填写" }}</span
      ></v-col
    >
  </v-row>
</v-card-text>


let newExtrlArr = extrlAttrs.filter(
  item =>
    item.name !== "nickname" &&
    item.name !== "mobilephone" &&
    item.name !== "emailaddress"
);
this.editeFilterExtrl = deepClone(newExtrlArr);
let result = [];
for (let i = 0; i < newExtrlArr.length; i += 3) {
  result.push(newExtrlArr.slice(i, i + 3));
}

result.map(item => {
  let n = (3 - item.length) % 3;
  for (let i = 0; i < n; i++) {
    item.push("");
  }
  return item;
});
this.filterExtrl = result;