Vue - Как искать фильтр определенной части в данных?

Question

Я создаю небольшое приложение Vue с firestore.

Я выбираю данные из палитры даты и времени и отправляю данные в этом формате в дб.

{{date}}: 2018-09-15T00: 00: 00.000Z

Здесь 09 показывает месяц.

У меня есть цикл v-for, подобный этому:

<tbody v-for="item in filteredList">
    <tr>
    <td>{{item.date.slice(0,10)}}</td>
    </tr>
</tbody>

У меня есть этот фильтр в свойстве Computed:

computed: {
    filteredList() {
        return this.items.filter(item => { return item.date.toLowerCase().includes(this.search.toLowerCase()) })
   }
}

Итак, я хочу выполнить поиск с помощью ввода или выбора раскрывающегося списка, который будет фильтровать элементы по месяцу:

2018-09-15T00: 00: 00.000Z. от 09 в этом случае

Как я могу это сделать?

Answer 1

Предполагается, что у вас есть фильтр (текст, выпадающий список и т. Д.), Равный

1. привязан к элементу данных filterText.
2. Имеет двухзначное строковое значение для представления месяца.
3. Использует пустую строку для обозначения «без фильтра».

Вы бы сделали это:

computed: {
  filteredList() {
    return this.items.filter(item => {
      const field = parseInt(item.date.substring(5, 7)) // the month part of the date

      if (this.filterText === '') return true
      else return field === this.filterText
    })
  }
}

Вот пример фильтрующего элемента, привязанного к filterText

<select v-model='filterText'>
    <option v-for='n in 12' :value='pad2(n)'>{{n}}</option>
</select>

Привязано к данным

  data: {
    filterText:'03'
  },

и метод заполнения

methods: {
     pad2(number) {
  if (number<=99) { number = ("0"+number).slice(-2); }
  return number;
}

Answer 2

Я рекомендую вам использовать Moment.js , если вы много работаете со временем, поскольку он поддерживает тонны операций.

Вот еще несколько документов и Соответствующий пост SO