http://saas.irene.com/#/stock/detail/482?wh=irene&dateRange=2017-07-04&dateRange=2017-07-11&name=irene&package_spe=1
如何让?后面的参数以不拼接URL的方式传递
http://saas.irene.com/#/stock/detail/482?wh=irene&dateRange=2017-07-04&dateRange=2017-07-11&name=irene&package_spe=1
如何让?后面的参数以不拼接URL的方式传递
使用vue-router中的params传递参数,参数信息不拼接在url后面
声明式导航 <router-link :to="{path:'/foo', name:'foo', params:{ id:1} }">Go to foo</router-link>
编程式导航 this.$router.push({path:'/foo',name:'foo',params:{id:1}})
这里必须带name属性否者参数带不过去 , 贴上可运行的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<p>
<router-link :to="{path:'/foo', name:'foo', params:{ id:1,name:'foo'} }">Go to foo</router-link>
<br>
<router-link to="/bar">Go to bar</router-link>
</p>
<div>
<router-view></router-view>
</div>
</div>
</body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<script type="text/javascript">
//定义组件
const Foo = {
name: 'foo',
template: '<div>foo {{$route.params}}</div>'
}
const Bar = {
name: 'bar',
template: '<div>bar</div>'
}
//定义路由
const routes = [{
path: '/foo',
name: 'foo',
component: Foo
},
{
path: '/bar',
name: 'bar',
component: Bar
}
]
//创建router 实例
const router = new VueRouter({
routes
});
new Vue({
el: '#app',
data: {},
router
})
</script>
</html>
那你的这些参数可以通过vuex进行 store存储的管理,作为中间件去托管,到了你跳转的页面后,在从中拿出来用即可,唯一的确定就是页面不可以刷新,一旦刷新数据就会恢复到初始值了。
5 回答4.8k 阅读✓ 已解决
4 回答3.1k 阅读✓ 已解决
2 回答4.7k 阅读✓ 已解决
4 回答4.3k 阅读✓ 已解决
4 回答1.9k 阅读✓ 已解决
2 回答2.6k 阅读✓ 已解决
2 回答2.5k 阅读✓ 已解决
题主可以用
vuex
进行管理定义你data类型
使用
this.$store.commit("update_parameter")
更新你的参数通过
this.$store.state.parameter
获取你的参数转跳用
a
标签来模拟.通过router.push()
进行跳转