vue3.0路由跳转传参和参数获取方式
方法一:import { useRouter } from "vue-router";//引入路由setup() {//实例化路由const router = useRouter();console.log(router.currentRoute.value.query.id);//获取参数//路由跳转方法function goHome() {//不带参数// router.push("/");/
·
方法一:
import { useRouter } from "vue-router";//引入路由
setup() {
//实例化路由
const router = useRouter();
console.log(router.currentRoute.value.query.id);//获取参数
//路由跳转方法
function goHome() {
//不带参数
// router.push("/");
//router.replace("/");//用replace没有历史记录
//路由跳转带参数
router.push({
path:"/",
query:{
id:"2"
}
})
}
return {
goHome,
};
},
方法二:
import { getCurrentInstance } from "vue";//当前组件实例
setup() {
const { ctx } = getCurrentInstance();//实例化当前组件
console.log(ctx.$router.currentRoute.value.query.id);获取参数
//路由跳转方法
function goHome() {
//路由跳转不带参数
//ctx.$router.push("/");
//ctx.$router.replace("/");//用replace没有历史记录
//路由跳转带参数
ctx.$router.push({
path: "/",
query: {
id: "2",
},
});
}
return {
goHome,
};
},
更多推荐
已为社区贡献7条内容
所有评论(0)