需要实现效果如下：

流程：

        1.在（Vue3 Router（路由）的基本使用_Zhichao_97的博客-CSDN博客）基础上，在vue3Router01>src>compontents新建组件ToOtherPage.vue，如下图：

 ToOtherPage.vue:

<template>
    <div>
        <h1>ToOtherPage</h1>
        <button @click="ToOtherPage">去首页</button>
    </div>
</template>

<script>
    export default {
        name: "ToOtherPage",

        methods:{
            ToOtherPage(){
                this.$router.push("/")
                // this.$router.push({path:'/'})

                // 袖带参数跳转
                // this.$router.push({path:"/xxx/123456"})
                // this.$router.push({name:"xxx",params:{id:12345}})
                // this.$router.push({path:"/",query:{keyword:'cc'}})
            }
        }
    }
</script>

<style scoped>

</style>

        2.在vue3Router01>src>router>index.js中修改代码如下：

import {createRouter,createWebHashHistory} from 'vue-router'
import Home from "../components/Home.vue"
import ToOtherPage from "../components/ToOtherPage.vue";

// 1. Define route components.
// These can be imported from other files


// 2. Define some routes
// Each route should map to a component.
// We'll talk about nested routes later.
const routes = [
    {
        // name:"xxx",
        path: '/',
        component: Home
    },
    {
      path:'/ToOtherPage',
      component:ToOtherPage
    },
]

// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
const router = createRouter({
    // 4. Provide the history implementation to use. We are using the hash history for simplicity here.
    history: createWebHashHistory(),
    routes, // short for `routes: routes`
})

export default router

如果要实现带这种形式的参数：

 在ToOtherPage.vue中，使用此方式实现：