Vue.js 如何在Laravel vuejs中使用新数据刷新数据表?
我正在vue js中使用datatables 1.10.19。将新数据插入数据库后,如何刷新表?我使用了clear、destroy和draw,但没有任何效果。这是我的全部代码。 在刷新页面之前,数据不会加载到datatable中Vue.js 如何在Laravel vuejs中使用新数据刷新数据表?,vue.js,Vue.js,我正在vue js中使用datatables 1.10.19。将新数据插入数据库后,如何刷新表?我使用了clear、destroy和draw,但没有任何效果。这是我的全部代码。 在刷新页面之前,数据不会加载到datatable中 table() { this.$nextTick(() => { $('#sampleTable').DataTable(); })
table() { this.$nextTick(() => {
$('#sampleTable').DataTable();
})
},
get() {
axios.get('api/user').then(res => {
this.users = res.data
// console.log("after: " + this.users);
this.table()
});
axios.get("api/getRoles").then(({
data
}) => (this.roles = data));
// if (refreshIt == true) {
// this.retable();
// } else {
this.table();
// }
$(".selectpicker").selectpicker();
},
create() {
// this.validation();
this.form.post('api/user').then(() => {
$("#addnew").modal("hide");
toast.fire({
icon: "success",
type: "success",
title: "Information Created Successfully!"
});
Fire.$emit("refreshPage");
this.form.reset();
})
.catch(er => {
console.log(er);
});
created() {
// we call the show function here to be executed
this.get();
Fire.$on("refreshPage", () => {
this.get();
});}
我在create函数$('#sampleTable').DataTable().destroy()中找到了销毁数据表的解决方案;然后像下面那样创建它
create() {
this.form.post('api/user').then(() => {
$("#addnew").modal("hide");
toast.fire({
icon: "success",
type: "success",
title: "Information Created Successfully!"
});
$('#sampleTable').DataTable().destroy();// here I destroyed the table
Fire.$emit("refreshPage");// here I recreated the table
this.form.reset();
})
.catch(er => {
console.log(er);
});
},