iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >Vue中怎么动态设置路由参数
  • 103
分享到

Vue中怎么动态设置路由参数

2024-04-02 19:04:59 103人浏览 安东尼
摘要

Vue中怎么动态设置路由参数,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。1.使用this.$router.Go(),与js histro

Vue中怎么动态设置路由参数,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

1.使用this.$router.Go(),与js histroy.go() 用法一直,前进1,后退-1,当前页面:0

注意 使用go时 必须是已经有访问历史记录了

案例:

<template>
  <div> 
    <button @click="goht">后退<button> <br/>
    <button @click="goqj">前进<button> <br/>
    <button @click="gosx">刷新当前<button>
  </div>
 </template>
 <script>
  export default {
    methods: {
     goht(){
       this.$router.go(-1);
     },
     goqj(){
        this.$router.go(1);
     },
     gosx(){
       this.$router.go(0); //或者 this.$router.go(); 
     }
    }
  }
 </script>

2.使用push调用:

案例

<template>
  <div>
     <button @click="pageA">去A页面</button> <br/>
     <button @click="pageB">去B页面</button> <br/>
  </div>
</template>
<script> 
 exprot default {
  methods: {
     pageA(){
        //去路由A页面,字符串形式只能是path,类似to="path"
       this.$router.push('/RouterA'); 
     },
     pageB(){
        //去路由B页面,数组形式,类似 :to="{}"
       this.$router.push(
         {
          name: 'RouterB',
          query: {'name': 'name1', title: 'title1'}
          //,params:{'name': 'name2', title: 'title2'}
         }
       );
     }
   }
 }
</script>

关于Vue中怎么动态设置路由参数问题的解答就分享到这里了,希望以上内容可以对大家有一定的帮助,如果你还有很多疑惑没有解开,可以关注编程网node.js频道了解更多相关知识。

--结束END--

本文标题: Vue中怎么动态设置路由参数

本文链接: https://www.lsjlt.com/news/72402.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Vue中怎么动态设置路由参数
    Vue中怎么动态设置路由参数,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。1.使用this.$router.go(),与js histro...
    99+
    2022-10-19
  • Vue动态设置路由参数的方法是什么
    这篇文章主要介绍“Vue动态设置路由参数的方法是什么”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Vue动态设置路由参数的方法是什么”文章能帮助大家解决问题。1.使用this.$router.go(...
    99+
    2023-07-04
  • vue动态路由配置及路由传参的示例分析
    这篇文章主要介绍了vue动态路由配置及路由传参的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。动态路由:  当我们很多个页面或者组件...
    99+
    2022-10-19
  • 怎么设置软路由全国动态ip
    本篇内容介绍了“怎么设置软路由全国动态ip”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成! 动态ip一般用于居民公寓内部或校园区,采...
    99+
    2023-06-20
  • vue项目keepAlive配合vuex动态怎么设置路由缓存
    这篇文章主要介绍“vue项目keepAlive配合vuex动态怎么设置路由缓存”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“vue项目keepAlive配合vuex动态怎么设置路由缓存”文章能帮助大...
    99+
    2023-06-30
  • vue中怎么设置二级路由
    本篇文章为大家展示了vue中怎么设置二级路由,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。首先把一级路由的结构准备好: <router-link&n...
    99+
    2022-10-19
  • vue-router如何实时动态替换路由参数(地址栏参数)
    目录实时动态替换路由参数(地址栏参数)应用场景用法如下replace()和push() 的区别动态替换路由-Url参数安装webpack-merge引入包操作参数实时动态替...
    99+
    2022-11-13
  • 怎么用vue实现动态路由
    这篇文章主要介绍了怎么用vue实现动态路由的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇怎么用vue实现动态路由文章都会有所收获,下面我们一起来看看吧。1、什么是动态路由?动态路由,动态即不是写死的,是可变的。...
    99+
    2023-07-02
  • VUE中怎么实现路由动态加载
    VUE中怎么实现路由动态加载,相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。首先新建vue工程,一般我们不会特殊处理路由,但当项目页面越来越多,...
    99+
    2022-10-19
  • vue中怎么实现路由传参
    本篇文章为大家展示了vue中怎么实现路由传参,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。在vue路由中,支持3中传参方式。场景,点击父组件的li元素跳转到子组件中...
    99+
    2022-10-19
  • SpringCloud Gateway动态路由怎么配置
    这篇“SpringCloud Gateway动态路由怎么配置”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Spri...
    99+
    2023-07-05
  • VUE怎么实现路由传递参数
    本篇内容介绍了“VUE怎么实现路由传递参数”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!在路由时传递参数,一般有两种形式,一种是拼接在url...
    99+
    2023-07-04
  • vue后台管理怎么配置动态路由菜单
    本篇内容介绍了“vue后台管理怎么配置动态路由菜单”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!后台管理配置动态路由菜单前段时间做一个后台管...
    99+
    2023-06-29
  • vue-admin-template动态路由怎么实现
    本篇内容介绍了“vue-admin-template动态路由怎么实现”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!提供登录与获取用户信息数据...
    99+
    2023-06-25
  • vue动态添加路由addRoutes之不能将动态路由存入缓存怎么办
    这篇文章将为大家详细讲解有关vue动态添加路由addRoutes之不能将动态路由存入缓存怎么办,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。在我不知道vue的路由还可以通...
    99+
    2022-10-19
  • vue项目keepAlive配合vuex动态设置路由缓存方式
    目录需求效果图解决方案1.App.vue文件2.main.js文件3.store/modules/common.js文件4.utils/utils.js文件5.store/index...
    99+
    2022-11-13
  • Vue怎么获取url路由地址和参数
    这篇“Vue怎么获取url路由地址和参数”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Vue怎么获取url路由地址和参数”文...
    99+
    2023-07-05
  • Vue怎么不通过路由获取URL参数
    这篇文章主要介绍“Vue怎么不通过路由获取URL参数”,在日常操作中,相信很多人在Vue怎么不通过路由获取URL参数问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Vue怎么不通过路由获取URL参数”的疑惑有所...
    99+
    2023-07-06
  • vue怎么一步到位实现动态路由
    今天小编给大家分享一下vue怎么一步到位实现动态路由的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。首先呢,先看看静态路由的配...
    99+
    2023-06-30
  • vue动态路由指的是什么该如何配置
    今天小编给大家分享一下vue动态路由指的是什么该如何配置的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。在vue中,动态路由就...
    99+
    2023-06-29
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作