Переход из кода в Nuxt

Ссылка в разметке подходит, когда переход - прямое действие пользователя «открыть эту страницу». Но маршрут иногда меняют после шага в логике: форма отправлена, выбор сохранён, нужно показать следующий экран. Тогда удобнее вызвать навигацию из функции.

В Nuxt для программного перехода служит функция navigateTo. Его не импортируют вручную: фреймворк подставляет функцию так же, как NuxtLink или useRoute. По клику результат похож на переход по NuxtLink - меняется адрес и NuxtPage, без полной перезагрузки вкладки. Страница app/pages/orders.vue должна существовать, иначе сработает обработка ошибки маршрута.

Давайте разберём кнопку, которая открывает раздел заказов:

<script setup>
	function openOrders() {
		navigateTo('/orders');
	}
</script>
<template>
	<p>
		Welcome to our site.
	</p>
	<button type="button" @click="openOrders">
		Open orders
	</button>
</template>

Сделайте кнопку, по нажатию которой открывается адрес /orders.