将条件语句应用于Vuetify v-for循环不能正常工作

<template>
  <div>
    <v-card v-for="item in items" :key="item.id" v-if="item.status === 'active'">
      <v-card-title>{{ item.title }}</v-card-title>
      <v-card-text>{{ item.description }}</v-card-text>
    </v-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, title: 'Item 1', description: 'Description 1', status: 'active' },
        { id: 2, title: 'Item 2', description: 'Description 2', status: 'inactive' },
        { id: 3, title: 'Item 3', description: 'Description 3', status: 'active' }
      ]
    };
  }
};
</script>