需要具备父子组件通信的知识 不知道的可以看我的笔记了解—里面的第26、27条

• 多页面结构截图

• 效果 gif 图

正文

分页组件源码

1. 新建分页 .vue 文件 src -> components -> pagination -> index.vue，编辑 index.vue 文件 ```

2. 父组件相应的使用示例，多余的源码已删除

- `axios` 挂载是在相应的 `js` 文件中

import Vue from ‘vue’ import axios from ‘axios’

Vue.prototype.axios = axios

```

总结

刚开始觉得还是蛮简单的，后来发现最早时候写的 bug 很多

• 需要注意的地方(bug 产生的原因)：
• 搜索后要将 “页码重置为 1”
• “如果当前搜索成功之后，但是页码数量少于 页码列表总长度 ，比如两页，之后将搜索框内容手动删除，再点击分页会出现请求到的数据已更新为全部，但是分页列表数组 length 还是 2 导致的 bug“