Now that we have a select input for the category, let's make it work as a filter. After selecting a category, the list should show only the posts that only belong to that category.
Vue: Watch the Selected Category
To get all the posts that belong to a category, we need to watch the selectedCategory
variable. First, we need to import watch
from the Vue.
resources/js/components/Posts/Index.vue:
<template> // ...</template> <script setup>import { onMounted, ref } from "vue"; import { onMounted, ref, watch } from "vue"; import { TailwindPagination } from 'laravel-vue-pagination';import usePosts from "@/composables/posts";import useCategories from "@/composables/categories";// ...</script>
Now using this watch()
function, we can watch the selectedCategory
variable for the changes with two values: current
and previous
.
Inside watch
we can call the...