Search⌘ K
AI Features
Home
Courses
A Beginner’s Guide To Nuxt 3

Safe Search

Explore how to implement safe search functionality in a Nuxt 3 project, enabling you to filter image results to be suitable for all ages. Learn to create a dynamic toggle with a checkbox, update the query string reactively, and manage safe search state with composables and useState for interactive user-controlled search results.

We'll cover the following...

Another option we can add to our query string when requesting data is a safe search. When set to true, only the images which are suitable for all ages will be returned.

Adding safe search

It is added to our query string like this:

Javascript (babel-node)
	const { data: images } = useFetch(
		() =>
			`?key=${apiKey}&q=${searchTerm.value}&page=${currentPageNumber.value}&per_page=${imagesPerPage.value}&safesearch=true`,
		{
			baseURL: baseUrl,
		}
	);

We only need to add this when we want safe search to be true since the default value is ...