Laravel Vue Inertia动态分页与安装错误

Question

我在Laravel Inertia中使用动态查询，我的分页有问题，因为每次我试图更改分页时，vue的mount((方法都会运行。

data() {
return {
form: this.$inertia.form({
search: this.filters.search,
order: "asc",
column: "code",
size: 5,
}),
};
},
mounted() {
this.$inertia.get(this.route("groups.index"), pickBy(this.form), {
preserveState: true,
});
},
watch: {
form: {
deep: true,
handler: throttle(function () {
this.$inertia.get(
this.route("groups.index"),
pickBy(this.form),
{ preserveState: true }
);
}, 150),
},
},

我只需要在第一次或组件渲染时使用mount((，但我不希望每次使用或更改分页时都运行mount((函数，对此有什么解决办法吗？

'groups' => Group::where('company_id', Auth::user()->company_id)
->when($request->search, function($query, $term){
$query->where('code', 'LIKE' , '%' . $term. '%')
->orWhere('name', 'LIKE' , '%' . $term. '%')
->orWhere('description', 'LIKE' , '%' . $term. '%');
})->when($request->column, function($query, $term) use ($request){
$query->orderBy($term, $request->order);
})->paginate($request->size)->withQueryString(),

这是我的疑问。

Answer 1

我不确定为什么在您的情况下没有保留状态，我需要测试它。

我处理它的方式略有不同(例如使用composition api(

我不在挂载上做请求，这似乎有点多余，也许是什么导致了你的问题，你不应该在挂载上进行过滤，因为当你最初挂载时，这应该是你的初始请求，用户还没有更改文件中的任何内容

// you can also get the current filters from route().params
// current filters coming from the server
const props = defineProps({
filters: Object,
})
const form = reactive({
search: props.filters.search,
order: props.filters.order,
column: props.filters.column,
size: props.filters.size,
})
const filter = throttle(function() {
Inertia.get(route(route().current()), pickBy(form), {
preserveState: true,
preserveScroll: true,
})
}, 150)
watch(form, filter)