vue路由带参跳转，刷新后参数不消失

方法一：$router里使用query对象

路由带参数跳转

this.$router.push({                        name: 'IcProjectView',//跳转的路由（路由的name）                        params: {//params                          id: params.row.id,                          CURD: {                            value: 'read', readonly: true, disabled: true, visiable: false,                          },                        },                        query:{value: 'read', readonly: true, disabled: true, visiable: false}//query对象，跳转到新路由，然后刷新页面，能继续获取到query 对象                      })

刷新页面获取query对象

created() {      if(this.$route.params.CURD!=undefined){        this.CURD.value = this.$route.params.CURD.value;        this.CURD.readonly = this.$route.params.CURD.readonly;        this.CURD.disabled = this.$route.params.CURD.disabled;        this.CURD.visiable = this.$route.params.CURD.visiable;      }else{        this.CURD.value = this.$route.query.value;        this.CURD.readonly = this.$route.query.readonly;        this.CURD.disabled = this.$route.query.disabled;        this.CURD.visiable = this.$route.query.visiable;      }

}

这样你的 url 就会像http://xxx.xxx.xxx/value?value='read'，这样无论你怎么刷新value都不会丢失,参考https://router.vuejs.org/zh-cn/essentials/named-routes.htmlVue-router 命名路由

ps:

router-link

• 在HTML5 history模式下使用了base选项,所有to属性可以不用写基路径
• 会拦击点击事件,不会重新加载页面.
• router-link默认渲染为a标签,我们可以通过tag属性设置为别的标签(常用的li).

• to属性可以绑定name(命名组件),query(带查询参数)

<router-link :to="{name:'entityList', query:{page: 'Ecp.SystemMessage.List.vdp'}}" class="msg" tag="li"></router-link>//放在需要跳转的标签内

方法二：$router里使用params对象
this.$router.push({name:'articleDetail, params:{articleId: articleId}});跳转，那么在路由里就要这样写

routes: [    {      path: '/articleDetail/:articleId',      name: 'articleDetail'    }  ]

path: '/articleDetail/:articleId',里的 :articleId 是必须要有的