ajax queryparams传值,vue-router query和params传参(接收参数)$router $route的区别

vue-router query和params传参(接收参数)$router $route的区别

vue-router query和params传参(接收参数)$router $route的区别

1.query方式传参和接受参数

传参:

this.$router.push({

path:'/xxx',

query:{

id:id

}

})

接收参数:

this.$route.query.id

注意:传参是this.

r

o

u

t

e

r

,

接

收

参

数

是

t

h

i

s

.

router,接收参数是this.

router,接收参数是this.route

this.router 和this.router和this.route区别：

router为VueRouter实例，想要导航到不同URL，则使用router.push方法

$route为当前router跳转对象，里面可以获取name、path、query、params等

2.params方式传参和接收参数

传参:

this.$router.push({

name:'xxx',

params:{

id:id

}

})

接收参数:

this.$route.params.id

注意:params传参，push里面只能是 name:‘xxxx’,不能是path:’/xxx’,因为params只能用name来引入路由，如果这里写成了path，接收参数页面会是undefined！！！

直白的来说query相当于get请求，页面跳转的时候，可以在地址栏看到请求参数，而params相当于post请求，参数不会再地址栏中显示

vue-router query和params传参(接收参数)$router $route的区别相关教程

vue-router 解析

vue-router 解析 本文将以最简单的方式解析 vue-router 实现原理，最全的实现过程请参考源码 先简单回顾一下原生 vue-router 的使用方式 router/index.js import Vue from 'vue'import VueRouter from 'vue-router'import Home from '@/views/Home'// 1.引入

jQuery基础语法

jQuery基础语法 jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互，能够极大地简化JavaScript编程。 它的宗旨就是：“Write less, do more.“ 那么我

jquery事件委托

jquery事件委托 事件委托：通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件。原理：利用冒泡的原理，把事件加到父级上，触发执行效果。

「Vue.js」Vue-Router + Webpack 路由懒加载实现

「Vue.js」Vue-Router + Webpack 路由懒加载实现 一.前言 当打包构建应用时，Javascript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。结合 Vue 的异步组件

jQuery LigerUI 插件介绍及使用之ligerGrid

jQuery LigerUI 插件介绍及使用之ligerGrid 一，简介 ligerGrid 的功能列表： 1, 支持本地数据和服务器数据 ( 配置 data 或者 url) 2, 支持 排序和分页(包括 Javascript 排序和分页 ) 3, 支持列的 “ 显示 / 隐藏 ” 4, 支持明细行 ( 表格内嵌 ) 5, 支持汇总

jQuery LigerUI 插件介绍及使用之ligerGrid

jQuery LigerUI 插件介绍及使用之ligerGrid 一，简介 ligerGrid 的功能列表： 1, 支持本地数据和服务器数据 ( 配置 data 或者 url) 2, 支持 排序和分页(包括 Javascript 排序和分页 ) 3, 支持列的 “ 显示 / 隐藏 ” 4, 支持明细行 ( 表格内嵌 ) 5, 支持汇总

(转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说

(转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明 (原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明 近期在移动方面的开发，使用jQuery Mobile ，移动方面的

jQuery插件 - tableEditor 1.0表格行内编辑

jQuery插件 - tableEditor 1.0,表格行内编辑 项目中开发到一半，需要实现表格行内编辑的功能，所以开发了这样一个jQuery的插件，目标是插件不变动已有的表格结构，完全实现插件化，随时安装及卸载。目前1.0还未能实现数据提交到后台保存，待1.1版本更新。 效