2017-10-13 9 views
1

この方法でデバウンスする前にthis.isLoading = trueを実行する方法を知っている人はいますか?デバウンスの前にローディングスピナーをシミュレートする

これは、Axios経由で非同期呼び出しを行うときにアニメーション化されるローディングスピナーとされていました。

methods: { 
     searchAdminUsers: _.debounce(function(query) { 
      this.isLoading = true  
      axios.get('api/searchEmployees?format=json', { params: { q:query } }) 
      .then(response => { 
       let data = response.data.map(item => (
        { text: `${item.FIRSTNAME} ${item.LASTNAME} - ${item.POSITION}`, id: item.ID } 
       )) 
       this.options = data 
       this.isLoading = false 
      }) 
      .catch(error => { 
      console.log(error) 
      }) 
     }, 250) 
    } 

答えて

2

this.isLoadingを変更する別のメソッドを作成し、debouncesメソッドを呼び出します。

methods: { 
    wrapSearchAdminUsers(query) { 
     this.isLoading = true 

     this.searchAdminUsers(query) 
    } 

    searchAdminUsers: _.debounce(function(query) { 
     axios.get('api/searchEmployees?format=json', { params: { q:query } }) 
     .then(response => { 
      let data = response.data.map(item => (
       { text: `${item.FIRSTNAME} ${item.LASTNAME} - ${item.POSITION}`, id: item.ID } 
      )) 
      this.options = data 
      this.isLoading = false 
     }) 
     .catch(error => { 
     console.log(error) 
     }) 
    }, 250) 
} 
関連する問題