vue路由

Vue路由以及前后端交互

路由跳转this.$router.push('/course');//这个是用来管理路由跳转的，可以直接写后缀this.$router.push({name:course});//也可以写字典是用来管理路由前进后退this.$router.go(-1);后退this.$router.go(1);前进课程页课程页路由传参第一种routes:[//...{path:'/course/:id/detai
帅气逼人23·2019-10-11 20:00

解决移动端跳转问题(CSS过渡、target伪类)

前言很多刚刚接触移动端的小伙伴都可能对于点击跳转路由这方面有些疑惑，特别是运用了Vue路由，因此这篇文章就带领小伙伴一起尝试用css进行页面跳转效果如图，由于是移动端，所以选择预览的手机模拟：HTMLshouyezhanlangerenshouyezhanlangeren
·2019-10-10 20:20

Vue 路由组件 页面传递参数

文章目录1vue路由传参$route对象props传递布尔模式对象模式函数模式通过属性来传值2编程式组件路由传值编程式路由传参1vue路由传参vue路由传参，是页面通信的重要组成部分，而掌握路由传参，用到
A 是小阿怪啊·2019-10-09 22:05

react, vue路由去中心化webpack.context

自动匹配pages下面的的index.jsx。生成router配置文件。并且支持按需加载。constrouters=[];constpages=require.context('../pages',true,/index\.jsx$/,'lazy');pages.keys().forEach(item=>{routers.push({path:item.slice(1,item.indexOf('
嘻倪孢·2019-09-29 00:00

vue-router钩子函数实现路由守卫

接上一篇，我们一起学习了vue路由的基本使用以及动态路由、路由嵌套以及路由命名等知识，今天我们一起来学习记录vue-router的钩子函数实现路由守卫；何为路由守卫？
有梦想的咸鱼前端·2019-09-24 11:00

Vue路由传参及传参后刷新导致参数消失处理

项目功能需要，要从列表页跳转到第三方提供的URL上（这里第三方页面我是通过iframe引入在详情页，目的是点击返回时可以通过keepAlive让列表页不刷新，如果不通过iframe直接跳第三方链接，那么返回必然会重新拉取数据），一路百度，刚开始使用1this.$router.push({name:'list',params:{id:id}})在详情页获取参数：1this.$route.params
青竹玉简·2019-09-24 10:00

vue路由跳转时判断用户是否登录功能的实现

通过判断该用户是否登录过，如果没有登录则跳转到login登录路由，如果登录则正常跳转。一丶首先在用户登录前后分别给出一个状态来标识此用户是否登录（建议用vuex）；简单用vuex表示一下，不会可以自己去官网多看看；importVuefrom‘vue‘importVuexfrom‘vuex‘Vue.use(Vuex);varstate={isLogin:0,//初始时候给一个isLogin=0表示用
·2019-09-22 13:48

通过 Laravel 创建一个 Vue 单页面应用（一）

在此教程中，我们将学习如何构建并运行一个以Vue路由为前端，laravel为后端的SPA应用。首先我们将注意力集中在编写每一个小的功能代码块上，然后在后续的教程中，我们再演示如何将Laravel
Charlie_Jade·2019-09-22 11:02

Vue路由（vue-router）详细讲解指南

中文文档：https://router.vuejs.org/zh/VueRouter是Vue.js官方的路由管理器。它和Vue.js的核心深度集成，让构建单页面应用变得易如反掌。路由实际上就是可以理解为指向，就是我在页面上点击一个按钮需要跳转到对应的页面，这就是路由跳转；首先我们来学习三个单词（route，routes，router）：route：首先它是个单数，译为路由，即我们可以理解为单个路由
有梦想的咸鱼前端·2019-09-21 14:00

vue面试题之二：路由 vue-router 面试题

2.vue路由面试题1.mvvm框架是什么？
Arthas_Xue·2019-09-20 17:45

vue路由的两种模式以及history模式下后端配置

原文链接：https://www.cnblogs.com/mica/p/10876822.html1、hash——即地址栏URL中的#符号。hash虽然出现URL中，但不会被包含在HTTP请求中，对后端完全没有影响，因此改变hash不会重新加载页面。2、history——利用了HTML5HistoryInterface中新增的pushState()和replaceState()方法。需要特定浏览器
LeslieLiang·2019-09-19 15:15

Haytham个人博客开发日志 -- Flask+Vue基于token的登录状态与路由管理

指路牌符合一下关键词，这篇博客有可能会对你有帮助不使用工厂函数的Flask应用不使用蓝本的Flask应用Flask跨域配置基于Token的登录状态管理Flask+VueVue路由拦截Axios钩子适用场景这是一篇个人博客搭建的记录博客
wx5b3c8b549a762·2019-09-15 19:38

Haytham个人博客开发日志 -- Flask+Vue基于token的登录状态与路由管理

指路牌符合一下关键词，这篇博客有可能会对你有帮助不使用工厂函数的Flask应用不使用蓝本的Flask应用Flask跨域配置基于Token的登录状态管理Flask+VueVue路由拦截Axios钩子适用场景这是一篇个人博客搭建的记录博客
Haytham_Xu·2019-09-15 00:00

Vue路由守卫之路由独享守卫

路由独立守卫，顾名思义就是这个路由自己的守卫任务，就如同咱们LOL，我们守卫的就是独立一条路，保证我们这条路不要被敌人攻克(当然我们也得打团配合)在官方定义是这样说的：你可以在路由配置上直接定义beforeEnter守卫,这些守卫与全局前置守卫的方法参数是一样的。constrouter=newVueRouter({routes:[{path:'/foo',component:Foo,beforeE
前端伪大叔·2019-09-13 10:00

Vue路由守卫之路由独享守卫

路由独立守卫，顾名思义就是这个路由自己的守卫任务，就如同咱们LOL，我们守卫的就是独立一条路，保证我们这条路不要被敌人攻克(当然我们也得打团配合)在官方定义是这样说的：你可以在路由配置上直接定义beforeEnter守卫,这些守卫与全局前置守卫的方法参数是一样的。constrouter=newVueRouter({routes:[{path:'/foo',component:Foo,beforeE
前端伪大叔·2019-09-13 10:00

Vue路由守卫之组件内路由守卫

beforeRouteEnter,进入路由前。需要注意这里不能使用this,因为我们使用的是进入路由之前，那会组件还没创建，得不到this这个属性，所有我们只能使用过vm异步语句来让节点上树；exportdefault{data(){return{num:10}},beforeRouteEnter:(to,from,next)=>{next(vm=>{alert(vm.num)})},​}运行后可
前端伪大叔·2019-09-13 10:00

Vue路由history模式踩坑记录：nginx配置解决404问题

转至https://www.cnblogs.com/goloving/p/9170508.html问题背景：vue-router默认是hash模式，使用url的hash来模拟一个完整的url，当url改变的时候，页面不会重新加载。但是如果我们不想hash这种以#号结尾的路径时候的话，我们可以使用路由的history的模式。比如如下网址：使用hash模式的话，那么访问变成http://localho
cxf2018·2019-09-10 11:00

vue路由守卫及路由守卫无限循环问题详析

先贴一波官方文档的内容constrouter=newVueRouter({...})router.beforeEach((to,from,next)=>{//...})当一个导航触发时，全局前置守卫按照创建顺序调用。守卫是异步解析执行，此时导航在所有守卫resolve完之前一直处于等待中。每个守卫方法接收三个参数：to:Route:即将要进入的目标路由对象from:Route:当前导航正要离开的路
翔啊翔阿翔·2019-09-05 14:46

vue路由教程之静态路由

前言vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，也就是组件的切换。首先在html中，引入vue-router.js和vue.js，用router-link触发路由跳转，router-link可以像a标签一样使用和定义样式router-view区域是路
手指乐·2019-09-03 14:44

Vue使用Axios实现http请求以及解决跨域问题

的中文文档以及github地址如下：中文：https://www.kancloud.cn/yunye/axios/234845github:https://github.com/axios/axiosvue
ysx_小鱼·2019-09-02 15:00

前端-vue路由传参、axios前后台交互、cookie设置

目录路由传参标签传参方式：逻辑传参：this.$router第一种第二种第三种历史记录跳转路由汇总大案例vuex仓库概念使用axios前后台交互原生Django提供后台数据跨域问题django解决跨域问题数据接口vue-cookie处理cookieelement-ui框架使用路由传参标签传参方式：第一种router.js{path:'/course/detail/:pk',name:'course
ddt3520·2019-09-01 20:00

vue路由报错

今天遇到了一个从没有遇到过的问题，点击菜单时，控制台一直在报错。报错内容如下：Uncaught(inpromise)NavigationDuplicated{_name:“NavigationDuplicated”,name:“NavigationDuplicated”}；重新下载一下vue-router的包即可，[email protected]即可
小楠子_·2019-08-29 13:04

面试题

vue路由面试题1.mvvm框架是什么？2.vue-router是什么?它有哪些组件3.active-class是哪个组件的属性？4.怎么
白色薄荷糖·2019-08-26 18:31

VUE路由动态加载实例代码讲解

首先新建vue工程，一般我们不会特殊处理路由，但当项目页面越来越多，路由配置也会越来越大，路由文件就会变得不好维护importVuefrom'vue'importRouterfrom'vue-router'importHelloWorldfrom'@/components/HelloWorld'importHomefrom'@/components/Home'importTest1from'./t
浪子-狼·2019-08-26 16:48

Vue路由之JWT身份认证的实现方法

一、JWT身份认证简介JSONWebToken（JWT）是目前最流行的跨域身份验证解决方案，相较于session机制，服务器就不需要保存任何session数据了，也就是说，服务器变成无状态了，从而比较容易实现扩展。JWT实际上是一个令牌（Token），服务器会将一些元数据、指定的secret进行签名并生成token，并返回给客户端，客户端得到这个服务器返回的令牌后，需要将其存储到Cookie或lo
JS_Even_JS·2019-08-26 09:23

Vue路由之JWT身份认证

Vue路由之JWT身份认证一、JWT身份认证简介JSONWebToken（JWT）是目前最流行的跨域身份验证解决方案，相较于session机制，服务器就不需要保存任何session数据了，也就是说，服务器变成无状态了
JS_Even_JS·2019-08-25 00:00

vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题

最近项目中涉及到跨页面传参数和后台进行数据交互，看到需求之后第一反应就是用路由传参来解决；Vue中给我们提供了三种路由传参方式，下面我们一个一个的来看一下：方法一：params传参：this.$router.push({name:"admin",//这里的params是一个对象，id是属性名，item.id是值(可以从当前组件或者Vue实例上直接取)params:{id:item.id}})//这
有梦想的咸鱼前端·2019-08-23 14:00

vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题

最近项目中涉及到跨页面传参数和后台进行数据交互，看到需求之后第一反应就是用路由传参来解决；Vue中给我们提供了三种路由传参方式，下面我们一个一个的来看一下：方法一：params传参：this.$router.push({name:"admin",//这里的params是一个对象，id是属性名，item.id是值(可以从当前组件或者Vue实例上直接取)params:{id:item.id}})//这
有梦想的咸鱼前端·2019-08-23 14:00

vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题

最近项目中涉及到跨页面传参数和后台进行数据交互，看到需求之后第一反应就是用路由传参来解决；Vue中给我们提供了三种路由传参方式，下面我们一个一个的来看一下：方法一：params传参：this.$router.push({name:"admin",//这里的params是一个对象，id是属性名，item.id是值(可以从当前组件或者Vue实例上直接取)params:{id:item.id}})//这
有梦想的咸鱼前端·2019-08-23 14:00

Vue路由

vue-router路由https://router.vuejs.org/zh/我们要实现单页面应用，所以需要学习路由。跳转路由的几种方式：1、声明式：1)根据路由路径（/home/sort/detail）跳转点击查看子页面2)根据路由名称（detail）跳转点击查看子页面:to=""可以实现绑定动态的路由和参数2、编程式：1）this.$router.push({path:'/home/sort
大胡子哈登摩羯·2019-08-22 09:46

Vue组件懒加载和路由懒加载

Vue组件懒加载和Vue路由懒加载这里只记录了router层面上的懒加载方法，还有在*.vue中各种懒加载的方法，例如：需要的时候import组件，用完destory等等。
Markov Zheng·2019-08-20 16:38

使用 webpack 插件自动生成 vue 路由文件的方法

一款自动生成vue路由文件的webpack插件vue-route-webpack-plugin在项目中试点成功了，现在在项目中已经不需要再维护路由配置文件了，由插件自动生成，节省了大家维护路由的时间。
kybetter·2019-08-20 09:35

使用 webpack 插件自动生成 vue 路由文件

一款自动生成vue路由文件的webpack插件vue-route-webpack-plugin在项目中试点成功了，现在在项目中已经不需要再维护路由配置文件了，由插件自动生成，节省了大家维护路由的时间。
kybetter·2019-08-19 00:00

Vue路由模块化配置的完整步骤

前言企业运营后台页面很多，路由如若不区分模块化配置，所有路由挤在同一个文件将不好维护，所以路由的配置也要模块化分享两个解决方案――Vue路由配置的模块化（PlanAandPlanB）注册需要首先路由注册需要啥
Krryblog·2019-08-14 09:43

Vue 路由模块化配置

博客地址：https://ainyi.com/77企业运营后台页面很多，路由如若不区分模块化配置，所有路由挤在同一个文件将不好维护，所以路由的配置也要模块化分享两个解决方案——Vue路由配置的模块化（=
筱月·2019-08-13 14:00

通过JS拦截 pushState 和 replaceState 事件

首先需要知道vue框架路由变更原理这里可以查看相关文章或者看vue源码，这里直接写结论，vue路由通过使用pushState和replaceState方法来进行路由变更和替换的。
Yuhoo·2019-08-13 13:02

vue路由传参的三种方式

方式一通过query方式传参这种情况下query传递的参数会显示在url后面this.$router.push({path:'/detail',query:{id:id}})对应路由配置：{path:'/detail',name:'Detail',component:Detail}子组件获取参数this.$route.query.id方式二通过params方式传参this.$router.push
Thinkguo·2019-08-08 10:00

Vue路由前后端设计总结

一开始我还以为vue的路由只能用在工程化的项目里面呢，然后研究了一下才发现，在脚本化里面也是可以用的。其实呢不管在哪里用，把原理研究明白就对了。一、官网demo这里不得不吐槽一下官网，写的不清不楚的，在哪里使用都没有说清楚，几行代码一句话就轻飘飘的交代完事了，剩下的事情还得自己研究，比如HTML5HistoryAPI是怎么回事。这里又涉及了一个问题，想要用好vue，必须的基础是要先掌握的，因为vu
阳光男孩·2019-08-06 15:03

Vue教程(路由Router-传值)

  本文我们来介绍下在Vue中路由的传参问题Vue路由传参  首先我们来准备一个基本路由的页面，如下:Document登录注册//创建两个子组件模板对象varlogin={template:"登录模块"
波波烤鸭·2019-08-05 20:18

Vue路由实现页面跳转的两种方式（router-link和JS）

Vue.js路由可以通过不同的URL访问不同的内容，实现多视图的单页Web应用1、通过实现组件用于设置一个导航链接，切换不同HTML内容使用方法：简单写法demo2使用v-bind的写法demo2demo2传参的写法demo2这里传参需要在router.js中对demo2的路径进行配置，在path中demo2后添加通配符:和对应的userId，如下：{path:'/demo2/:userId',n
Leophen·2019-07-30 00:00

vue—route

VUE路由也就是vue-router为了跳转页面实现方式①hash原理locationhref②history通过历史记录跳转安装命令cnmpinstallvue-router--save-dev安装完成之后进入
ISOLATE_E·2019-07-27 15:21

06-Vue路由

什么是路由对于普通的网站，所有的超链接都是URL地址，所有的URL地址都对应服务器上对应的资源；对于单页面应用程序来说，主要通过URL中的hash(#号)来实现不同页面之间的切换，同时，hash有一个特点：HTTP请求中不会包含hash相关的内容；所以，单页面程序中的页面跳转主要用hash实现；在单页面应用程序中，这种通过hash改变来切换页面的方式，称作前端路由（区别于后端路由）；在vue中使用
bignewbie·2019-07-26 17:00

第九天vue面试题

Vue路由的实现原理❤更新视图但不重新请求页面，是前端路由原理的核心之一1，利用URL中的hash("#");#本身以及它后面的字符称之为hash可通过window.location.hash属性读取.2
小程要谦虚·2019-07-25 18:59

Vue路由刷新

Vue路由刷新1.App.vue代码exportdefault{provide(){return{reload:this.reload,}},data(){return{isRouterAlive:false
xrzzz·2019-07-25 18:56

vue路由跳转打开新窗口

需求因为某些原因，某个页面的加载需要很长时间。为了不让用户重新加载，再次等待很长时间，决定当从这个页面跳转其他页面时，打开一个新窗口。编程时导航使用路由对象的resolve方法解析路由，可以得到location、router、href等目标路由的信息。得到href就可以使用window.open开新窗口了。当页面有一个跳转时const{href}=this.$router.resolve({nam
lesdom·2019-07-18 08:28

vue路由跳转的方式

vue路由跳转有四种方式1.router-link2.this.$router.push()(函数里面调用)3.this.$router.replace()(用法同push)4.this.
麋鹿鲁哟·2019-07-15 18:00

使用vue-router在Vue页面之间传递数据的方法

前言几周前，我写了关于Vue路由的使用和在Vue页面导航的文章。这是在应用程序中探索的一个基本例子。通常，在将导航构建到应用程序中时，您会发现需要将数据从一个页面传递到另一个页面。
尖锐Ax·2019-07-15 10:20

vue面试题(第九天)

1.Vue路由的实现原理更新视图但不重新请求页面，是前端路由原理的核心之一vue路由的实现有两种模式hash模式history模式hash模式hash模式：在浏览器中符号“#”，#以及#后面的字符称之为
JuneLau·2019-07-10 08:30

前端常见面试题（六）@郝晨光

Vue路由的实现原理路由这个概念最初是由后端提出来的，在我们没有SPA单页面应用之前，使用的一直都是后端路由，根据不同的路由返回不同的页面，后来随着单页面应用的诞生，开始有了前端路由，实现不刷新但是更新页面的效果
郝晨光·2019-07-09 23:46

Vue路由守卫（导航守卫）+flex之今日笔记

flex布局传送门导航守卫传送门完整的导航解析流程导航被触发。在失活的组件里调用离开守卫。调用全局的beforeEach守卫。在重用的组件里调用beforeRouteUpdate守卫(2.2+)。在路由配置里调用beforeEnter。解析异步路由组件。在被激活的组件里调用beforeRouteEnter。调用全局的beforeResolve守卫(2.5+)。导航被确认。调用全局的afterEac
devincob·2019-07-04 16:28
上一页 33 34 35 36 37 38 39 40 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他