Search a list while typing in textbox VueJS 2

Question

I have a list of users from an array. And I want to filter them based on the search box(name) at the top. I saw that there are filters in VueJS 1. But not available in VuesJS 2.

Answer 1

        
        

        Search:
        
            
        

Pedning Duration 

        return {
            search:'',
            dupsearch:'',
            currentSort:'pending_duration_day',
            currentSortDir:'asc',
        }
        methods: {
        sortbytotal:function(s) {
            this.dupsearch='sort';
            this.search='';
            if(s === this.currentSort) {
                this.currentSortDir = this.currentSortDir==='asc'?'desc':'asc';
            }
            this.currentSort = s;
        },
            date(e){
            if(this.stdate){
                var fromdate = [];
                this.loading = true;
                fromdate.push(moment(this.stdate).format('YYYY-MM-DD'));
                this.showstart = moment(this.stdate).format('MMM DD, YYYY');
                axios.get('/open-ticket-detail?date='+fromdate).then(response => {
                    this.openticketdetail = response.data;
                    this.loading = false;
                    //console.log(this.openticket);
                })
            }
            e.preventDefault();   
        }
        },
        computed:{
        sortedCats:function() 
        {
            var self=this;
            if(self.search!=''){
               this.dupsearch='';
            }

            if(this.dupsearch=='sort'){
                return this.openticketdetail.open_tickets.sort((a,b) => {
                    let modifier = 1;
                    if(this.currentSortDir === 'asc') modifier = -1;
                    if(a[this.currentSort] < b[this.currentSort]) return -1 * modifier;
                    if(a[this.currentSort] > b[this.currentSort]) return 1 * modifier;
                    return 0;
                });
            }
            return this.openticketdetail.open_tickets.filter(function(openticket){return openticket.queue_name.toLowerCase().indexOf(self.search.toLowerCase())>=0;});
        },
    },