vue-route之params、query
需求:一个列表页,通过列表点击进入详情页,因为是tab页,同时不想同时打开多个详情
$route.params
类型: Object
一个 key/value 对象,包含了动态片段和全匹配片段,如果没有路由参数,就是一个空对象。
<router-link
class="title"
:to="{'name':'topicVisualDetail',params: { 'id': scope.row.topic_id, 'time': scope.row.data_time.slice(0,10)}}"
>{{ scope.row.title }}</router-link>
这个会打开不同的tab页:
/topicVisualDetail/c1554647257_197/2019041112
同时route配置里要这么写:
topicVisualDetail/:id/:time
$route.query
类型: Object
一个 key/value 对象,表示 URL 查询参数。例如,对于路径 /foo?user=1,则有 $route.query.user == 1,如果没有查询参数,则是个空对象。
<router-link
class="title"
:to="{'name':'topicVisualDetail',query: { 'id': scope.row.topic_id, 'time': scope.row.data_time.slice(0,10)}}"
>{{ scope.row.title }}</router-link>
/topicVisualDetail?id=c1554647257_197&time=2019041112
这里在使用的时候,切换tab会导致参数丢失,bug早就修复了: