路由的跳转

71 阅读1分钟

一、声明式导航nuxt-link

<template>

  <div>

    hello

    <Banner></Banner>

    <BannerChild></BannerChild>

    <nuxt-link to="/about?id=51&name='张三'">跳转到about页面</nuxt-link>

  </div>

</template>

在about页面接收

<script setup>

  const data = useRoute().query

  console.log(data)

</script>

控制台打印如图

图片.png

二、编程式导航

<template>

  <div>

    about

    <NuxtPage></NuxtPage>

    <div @click="navigateTo({

      path: '/',

      query: {

        id: 1,

        name: '李四'

      }

    })">跳转到首页</div>

  </div>

</template>

打印如图

图片.png