vue中关于redirect(重定向)初学者的坑

目录
  • 关于redirect(重定向)初学者的坑
  • vue-router路由重定向redirect的使用事项

关于redirect(重定向)初学者的坑

第一个对象里是配置路由重定向path:’/'为项目的根目录，redirect重定向为渲染的路径（这里我是指向了第二个对象里的path）

所以就要写第二个对象方便 redirect 找到它。。

第二个对象里的配置path:’/index’是自定义的路径，component / Customers组件名称

还有一种是 children 如下图：

首页名字为defaultPage 首页下有个子页index，于是写children …

vue-router路由重定向redirect的使用事项

在一个路由使用redirect重定向到另一个路由时，这个路由本身也需要component对应一个页面，而且这个页面里还要有< router-view >< /router-view>最终才能成功的跳转

以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • vue-router重定向不刷新问题的解决

    前阵子太忙了,自己一个人一边开发着新项目,一边维护着旧项目,没时间写博客,终于让我腾出时间了.废话少说,开始正文. 问题描述: 之前项目是angular开发的,后来用vue重构后.项目路径和vue路径不一致,但是app端分享出的链接,依旧是旧项目链接. 解决方法: 通过阅读vue-router的官方文档,发现重定向可以解决这个问题. 如之前文件路径是'/live/detail/id=7234','/skill/microList/',新项目路径是 '/s/live/detail?id=7234'

  • vue中重定向redirect:‘/index‘,不显示问题、跳转出错的完美解决

    在路由配置中,设置重定向后,浏览器打开是空白没有内容,这里首先确保你的结构没有写错,然后查看单词是否拼错误,一般情况是因为单词拼写错误. 修改后,跳转成功: 附录:VUE通过后端重定向到VUE的页面后,前端路由失效的解决方案 这个问题是我在做微信授权登录的时候遇到的. 具体描述: 用户打开页面后,路由拦截判断用户是否登录,如果未登录,则将用户的访问地址记录到localStorage里面,等待授权后重定向到该页面. 当我使用location.href将页面跳转到后端地址,进行微信用户信息获取完成,

  • 基于vue-router 多级路由redirect 重定向的问题

    在做多级路由的时候遇到很多问题,虽然不难,但是如果没有经验,往往要花一整天时间才能解决(可能我笨),况且网上资料也很少. 项目需要是这样的: 登录页面跳到后台页面重定向,登录页是一级路由 对应页面 登录后: 同时重定向二级和三级页面, 这样登录就会重定向了,此时url 但又有一个问题:当再次点击底部"堂食"的时候, url变成这样,并且三级页面没有出来 解决办法是:在这个"堂食"按键 添加一个方法 记住,也只有这样传参才有效 如果在<router-link&g

  • vue中关于redirect(重定向)初学者的坑

    vue中关于redirect(重定向)初学者的坑

    目录 关于redirect(重定向)初学者的坑 vue-router路由重定向redirect的使用事项 关于redirect(重定向)初学者的坑 第一个对象里是配置路由重定向path:’/'为项目的根目录,redirect重定向为渲染的路径(这里我是指向了第二个对象里的path) 所以就要写第二个对象方便 redirect 找到它.. 第二个对象里的配置path:’/index’是自定义的路径,component / Customers组件名称 还有一种是 children 如下图: 首页名字

  • 浅谈在django中使用redirect重定向数据传输的问题

    环境: python 3.6.4 django2.0.6 使用重定向redirect('url name') 如果不需要传数据的话那这样就OK了 如果要传数据的话 我琢磨了半天 还是决定用session来传输 所以 就这么干: request.session['key_name] = value request.session['msg'] = u'用户未登录' 然后在模板中使用: <h1>{{ request.session.username }}</h1> {# 输出usern

  • vue中路由参数传递可能会遇到的坑

    前言 vue中路由跳转传参数有多种,自己常用的是下面的几种 通过router-link进行跳转 通过编程导航进行路由跳转 本文主要给大家介绍了关于vue路由参数传递遇到的一些坑,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 首先我的路由的定义 { path: '/b', name: 'B', component: resolve => require(['../pages/B.vue'], resolve) } 我从A组件跳转到B组件,并通过路由信息对象传递一些参数 this

  • vue中使用微信公众号js-sdk踩坑记录

    最近又在vue中捣鼓了下微信公众号api的接入,不得不说这里边水是真的深啊,上次分享了微信授权登录和js-sdk签名的部分,其中很多朋友私信我表示了疑惑,今天我就再次尝试理顺一下这里边的坑吧: 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享.扫一扫.卡券.支付等微信特有的能力,为微信用户提供更优质的网页体验. 分享页面到朋友圈 上文是从官方文档

  • vue组件中iview的modal组件爬坑问题之modal的显示与否应该是使用v-show

    需求:点击btn,弹出modal显示图表(以折现图为例) 这应该是很基本的需求也是很容易实现的,代码和效果如下: 代码解释:setTem是一个方法,改变modal为true,默认为false : chart-line是图表子组件,通过data向其传递参数,data绑定的数据是父组件mounted后拿到的数据 效果图:点击btn后的确显示了modal框,但是里面的图表不能显示,接着改变子组件任何代码,迫使重新编译子组件,则子组件的图表可以正常显示 分析:当点击btn时,modal框的确弹出来了,但

  • vue中的mescroll搜索运用及各种填坑处理

    父组件处理: <template> <div class="wrap"> <!-- 搜索框 --> <div class="searchInputArea"> <div class="searchBarBox"> <div class="inputWrap" > <form onsubmit="javascript:return false

  • 浅谈vue中使用编辑器vue-quill-editor踩过的坑

    结合vue+element-ui+vue-quill+editor二次封装成组件 1.图片上传 分析原因 项目中使用vue-quill-editor富文本编辑器,在编辑内容的时候,我们往往会编辑图片,而vue-quill-editor默认的处理方式是直接将图片转成base64格式,导致上传的内容十分庞大,且服务器接受post的数据的大小是有限制的,很有可能就提交失败,造成用户体验差. 引入element-ui 编辑editor.vue文件 <template> <div> <

  • 基于vue中的scoped坑点解说

    今天在覆盖iview组件样式的时候发现一个问题,就是无法覆盖组件原有的样式,最后在github的issue中找到了答案: 不要使用scoped属性.于是我查找了下关于scoped的文章. 我们假设把这种组件叫做模块私有组件,其他的未加scoped的叫做模块一般组件.通过查看DOM结构发现:vue通过在DOM结构以及css样式上加唯一不重复的标记,以保证唯一,达到样式私有化模块化的目的. 代码如下: //valChange.less(使用了嵌套规则) #valueSlide{ .bigSlider

  • Vue中slot-scope的深入理解（适合初学者）

    百度上已经有很多的关于slot-scope的文章,但我感觉都是那些以前没学好,又回头学的人,他们都使用了.Vue文件,我觉得有点不适合初学者,所以我就写一篇适合初学者的. 先抛例程: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>组件之通过插槽(slot)分发内容</title> <script

随机推荐