vue-router个人实战总结

1.跳转刷新问题

很常见的一个问题，列表页具有新增、修改功能；详情页具有保存、返回功能。

从详情页返回到列表页时不需要刷新，因为没有操作：

将列表页加入到keepAlive中，详情页调用this.$router.go(-1)则列表页不会刷新。

在详情页新增或修改跳转到列表页时，此时是需要刷新的：

• 详情页使用这段代码跳转：this.$router.replace({name: 'ServeList', params: {refresh: 1}}) 。使用replace 防止点击浏览器自带回退再次返回到详情页；使用params 参数不会在地址栏出现；refresh 参数通知列表页刷新。

• 列表页负责监听路由对象变化：

watch:{
  $route(val){
    // 新增或修改
    if(val.params.refresh == 1){
      // 刷新列表
      this.queryParams.pageNum = 1
      this.getList()
    }
  }
},