vue如何页面不刷新的情况修改路由参数

Question

比如当前路由是/index，当我点击下面分页的时候路由变成/index?page=1,点第二页时page=2，但是页面不是整体刷新的的，只有列表部分是刷新的，这样应该怎样写啊，求大佬

Answer 1

使用vue-router的动态路由匹配。

Answer 2

列表的数据存储在data之中

data() {
    return {
        list: []
    }
}

使用v-for 渲染list内的数据
当发送请求获取到下一页的数据时，只需要使用this.list = newList(拿到的后台数据)，Vue检测到data中的数据变化，会重新渲染列表部分。

Answer 3

你完全可以在data里面记录一个当前第几页的数据啊，点击下一页的时候，执行一下请求的方法，获取到数据将列表重新渲染一下就好了啊。可以看看官方的v-for例子

Answer 4

用historyAPI
例如 history.pushState({page:4},"page4","?page=4")