关于vue框架与jquery的datatable结合使用心得

本人vue小白一枚，最近实习公司要求使用vue框架做一个能获取后端数据并实时展现的可翻页可查询表格，这本来是个很简单的事情，只要ajax和datatable的结合使用就能很轻松做到，但坑就坑在，vue的异步加载导致jquery的datatable怎么也拿不到数据，在百度加翻阅文档长达一个礼拜之后（实习公司，活比较轻），一直无法实现想要的功能，无奈只能自己去钻研发掘了，接下来上代码，如有误，请指正

data:{
	return{
		data:[]
	}
}

这里先定义一个变量用于接收后台数据

methods:{
	getdata:function(){
		//这里call后台api，具体不多述
		success:function(data){
			data = this.data
	}
		//在回调函数中将获取到的数据传给this.data
		
	},
	
}

//精彩的来了，将我们的datatable在watch函数中使用
watch:{
//这里的data是指一旦我们之前定义的data发生改变，后面的函数就会立即执行
	data:function(){
		var data = this.data; //接收改变后的data数据
		var tantable = $('#createtable').DataTable({
			//具体参数，请查看datatable官方文档，我不再多说
		})
		tantable.rows.add(data);
		tantable.draw();
	}
}

哦，这里还需要引入datatable.js

然后就是在template中写一个class=“createtable”的table了

总的来说，就是强行将jquery拖到了页面全部渲染完成并且数据也接收完毕之后再去执行，实在是查阅多方资料无果后，自己强行去发掘出来的办法，如有错误，请指正，谢谢观看