1new Vue({
2  el: '#app',
3  data: {
4    selectedType: '',
5    startDate:null,
6    endDate:null,
7    items: [
8      {
9        name: 'Nolan',
10        type: 'mercedes',
11        year: '2020',
12        country: 'england',
13        date: '08/01/2020'
14      },
15      {
16        name: 'Edgar',
17        type: 'bmw',
18        year: '2020',
19        country:'belgium',
20        date: '08/11/2020'
21      },
22      {
23        name: 'John',
24        type: 'bmw',
25        year: '2019',
26        country: 'england',
27        date: '08/21/2020'
28      },
29      {
30        name: 'Axel',
31        type: 'mercedes',
32        year: '2020',
33        country: 'england',
34        date: '08/01/2020'
35      }
36    ]
37  },
38  computed: {
39    filterItem() {
40      let filterType = this.selectedType;
41      let startDate = this.localizeDate(this.startDate);
42      let endDate = this.localizeDate(this.endDate);
43      
44      const itemsByType = filterType ? this.items.filter(item => item.type === filterType) : this.items
45      return itemsByType
46        .filter(item => {
47          const itemDate = new Date(item.date)
48          if (startDate && endDate) {
49            return startDate <= itemDate && itemDate <= endDate;
50          }
51          if (startDate && !endDate) {
52            return startDate <= itemDate;
53          }
54          if (!startDate && endDate) {
55            return itemDate <= endDate;
56          }
57          return true;
58        })
59    }
60  },
61  methods: {
62    localizeDate(date) {
63      // Date picker uses ISO format (yyyy-mm-dd), which is UTC. The data
64      // contains locale specific date strings (mm/dd/yyyy), which `Date`
65      // parses with local time-zone offset instead of UTC. Normalize the
66      // ISO date so we're comparing local times.
67      if (!date || !date.includes('-')) return date
68      const [yyyy, mm, dd] = date.split('-')
69      return new Date(`${mm}/${dd}/${yyyy}`)
70    },
71    formatDate(date) {
72      return new Intl.DateTimeFormat('en-US', { dateStyle: 'long' }).format(new Date(date))
73    }
74  }
75})

1<ul id="sortbydate">
2  <li v-for="(item, index) in items" style="list-style:none">
3    {{ index }} - {{ item.date }}
4  </li>
5</ul>