So implementieren Sie die effizienteste Datenbanksuchmethode in Laravel's Inertia/Vue

Question

Ich möchte die Kundenliste durchsuchen und die Komponente unverändert ändern.

Ich suche derzeit über diesen Link /customer/$searchColumn/$searchTerm?page=4

nach einem bestimmten Kunden.

Das gibt mein Controller zurück

return Inertia::render('Dashboard', [
    'customers' => Customer::whereLike("nr", (string)$request)->paginate(10),
]);

Rendert eine paginierte Tabelle aller gefundenen Elemente.

Vue ist derzeit sehr einfach:

<pre class="snippet-code-html lang-html Prettyprint-override"><code><script setup>
  importiere { usePage } aus '@inertiajs/vue3'
  Paginierung aus „@/mycompany/Pagination.vue“ importieren;
  const page = usePage()
</script></code>

Im Frontend rendere ich eine Tabelle mit:

<pre class="snippet-code-js lang-js Prettyprint-override"><code>v-for="customer in $page.props.customers.data"</code>

Ich möchte ein Suchfeld oben in der Tabelle, das die Ergebnisse während der Eingabe neu lädt.

Ich weiß nicht, wo ich anfangen soll.

Answer 1

对于这种情况，您可以使用常规的ajax/fetch请求来完成。

Inertia仍然利用laravel进行路由，所以没有某种请求或重定向是不可能完成这种表单请求的。

甚至inertia.js的创建者也支持使用xhr/fetch请求与inertia一起使用。