成品直播源码推荐,vue router编程式导航

成品直播源码推荐,vue router编程式导航

一、通过js跳转页面

导航有 router-link

 

1.1 新建一个Page.vue文件

 

1
<template><br>    <button @click="goPage">js跳转页面-按钮</button><br></template><br><script><br>export default {<br>    methods: {<br>        goPage() {<br>            //console.log(this.$router) //打印$router<br>            //this.$router.push('/') // 字符串路径<br>            //this.$router.push({path:"/"}) // 带有路径的对象<br>            //this.$router.push({path:'/user/123'}) //带有路径对象的参数<br>            //this.$router.push({name:'user',params:{id:1234}})//另一种形式<br>            //this.$router.push({path:"about",query:{name:"LLT"}})//带查询参数?<br>            //替换当前位置<br>            //this.$router.push({path:"about",query:{name:"LLT"},replace:true})<br>            this.$router.replace({ path: "about", query: { name: "LLT1" } })<br>        }<br>    }<br>}<br></script> 

1.2 配置路由器index.js

 

1
const routes = [<br>    {path:'/page',component:Page},//js跳转页面<br>]

 

 

1.3 配置App.vue

 

1
<router-link to="/page">js跳转页面</router-link><br> 

 

二、替换当前位置

 

1
this.$router.push({path:"about",query:{name:"LLT"},replace:true})<br>this.$router.replace({path:"about",query:{name:"LLT1"}})<br> 

 

三、后退一步

 

1
this.$router.go(-1)<br>this.$router.back()//后退,等于go(-1)<br>this.$router.forword() //前进,等于go(1)

 

 以上就是 成品直播源码推荐,vue router编程式导航,更多内容欢迎关注之后的文章

 

posted @   云豹科技-苏凌霄  阅读(122)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示