vue.js 为什么用forEach过滤数据后不能将数据推送到新对象?

r1zk6ea1  于 2023-06-24  发布在  Vue.js
关注(0)|答案(1)|浏览(118)

我有一个数组,它包含另一个数组,其中包含一个名称和一个数据.我想创建第二个对象,它包含数组中日期小于当前日期的项。
所以我做了以下事情:

data() {
    return {
      currentDate: moment().locale(this.$i18n.locale).format('YYYY-MM-DD'),
      currentReservations: [],
      reservations: [
        {
          guests: [
            {
              name: 'John',
              reservationDate: '2023-06-01'
            },
            {
              name: 'Bob',
              reservationDate: '2023-06-30'
            }
          ]
        }
      ]
    };
  },
  methods: {
    sortDates(){
      const active = this.reservations;
      active.forEach(reservation => {
        if(reservation.guests.reservationDate < this.currentDate){
          this.currentReservations.push(reservation)
        }
      })
    }
}

如果我运行这个方法,它只返回一个空数组,即使有比当前日期小的日期。
如果我使用v-for,我可以让它工作,但我需要做一个forEach,因为我需要在引导表中返回过滤后的数据,如下所示:

<b-table striped hover :items="currentReservations"></b-table>
jm81lzqq

jm81lzqq1#

你可以使用一个computed:

computed: {
    currentReservations() {
      return this.reservations.filter((reservation) => reservation.guests.reservationDate < this.currentDate);
    },
  },

相关问题