DataTables - 이전 테이블에서 데이터를 제거하고 새 테이블을 초기화하십시오.

Question

데이터 테이블에 문제가 있습니다. im는 vuejs 요청에서 돌아온 데이터를 표시하는 데 사용하지만 데이터를 가져오고 작성한 후에 정렬하는 것 같습니다. 두 번째 요청. 나는 새로운 요청을 할 때 내가 여기에 테이블이 잘 채워집니다 그리고 난 후 제대로 정렬 할 수 있지만에서 데이터를 얻을 후

내 첫 번째 요청이

var dates = this.dates; 
    var when = this.dates.when; 

    this.$http.get('getProfitsFrom='+when, dates, function(response){ 

     this.response = response; 

     window.setTimeout(function(){ 
      this.table = $('#table').DataTable({ 
       "aoColumns": [ 
        { "bSortable": true }, 
        { "bSortable": true }, 
        { "bSortable": true }, 
        { "bSortable": true }, 
        { "bSortable": true } 
       ] 
      }); 
     }, 1); 

    }).error(function(){ 
     console.log("Error"); 
    }); 

처럼 잘 데이터를 다시 가져 테이블을 나누면 데이터로 테이블이 채워지지만 정렬을 클릭하면 첫 번째 요청의 초기 데이터 만 표시됩니다.

이것은 내가 처음에는 데이터를 제거하고 테이블을 파괴해야한다고 생각하지만 내가하는 것처럼 보이지는 않습니다.

어떤 도움이 평가하고 필요한 추가 정보가 제공 될 것입니다, 당신에게

편집 감사합니다 : 내가 뭘 기본적으로 필요로하는 것은 새로운 값으로 채워 새 테이블 될 수 있도록 테이블을 다시 초기화 알고하는 것입니다 나는 안으로 통과한다

Answer 1

미안 나는 코멘트 대신에 응답으로 이것을 게시한다. 그러나 나의 평판은 코멘트를 게시하기 위해 낮다.

jsfiddle에서 가짜 아약스 요청을 사용하여 PHP 백엔드에 대한 호출을 에뮬레이트 할 수 있습니다.

또한 jQuery DataTables를 사용하는 특별한 이유가 있습니까? (부트 스트랩 스타일을 기본으로하지만, 스타일을 지정할 수 있습니다.) https://github.com/matfish2/vue-tables

Answer 2

아약스를 통해 데이터를로드하는 경우 테이블 ajax loaded을 작성하십시오. json 응답 구조를 다시 작업해야합니다. 또한 this을 참조하십시오.

거기에서 table.draw()를 호출 할 수 있습니다. 그것을 다시로드하십시오.