69 lines
1.9 KiB
Plaintext
69 lines
1.9 KiB
Plaintext
写页面
|
||
|
||
调接口
|
||
ajax 如何封装
|
||
|
||
页面 ---> 中间层
|
||
|
||
中间层 ---> ajax 封装
|
||
|
||
|
||
渲染接口数据到页面
|
||
|
||
绑定事件，实现功能 （封装方法，数组+下标）
|
||
|
||
|
||
|
||
|
||
思路：
|
||
|
||
1：index.js 中的 Index 类被初始化的时候，类的 构造函数 constructor 将被自动运行，
|
||
构造函数中的变量 index 和 principal 将被定义，方法 getClassApi 将被自动执行
|
||
|
||
2：getClassApi 被执行，发送请求获取 横向 菜单的数据，保存到 全局变量 principal 数组中。
|
||
遍历 principal 首先生成 li 横向菜单，然后生成li所对应的 列表内容
|
||
页面生成好后，开始初始化页面轮播图，为菜单的li标签批量绑定点击事件
|
||
|
||
3：请求首页的接口数据，然后通过数组加下标的规则找到 对应的 swiper-slide，将数据插入
|
||
|
||
|
||
|
||
【陆旗】1: 搜索
|
||
注意：从首页点击的时候，跳转进入 search.html 页面。
|
||
接口：http://127.0.0.1:3000/api/json/search?keyword=jkk
|
||
参数：keyword
|
||
|
||
【李康】2：机构
|
||
注意：li 标签内部套 a标签
|
||
接口：http://127.0.0.1:3000/api/json/mechanism
|
||
参数：无
|
||
|
||
【缪虎】3：模特
|
||
注意：无
|
||
接口：http://127.0.0.1:3000/api/json/mechanism
|
||
参数：无
|
||
|
||
|
||
|
||
【缪虎】进去标签点的列表页面
|
||
注意：需要修改 utils/index.js item 方法 <a href="./tagList.html?id="
|
||
滚动到底部 page +1 请求第二页数据
|
||
接口：http://127.0.0.1:3000/api/json/classList
|
||
参数：page id
|
||
|
||
|
||
【陆旗】机构页面点击进去的机构列表页面
|
||
注意：也需要a标签带参数进入下一个页面 id
|
||
滚动到底部 page +1 请求第二页数据
|
||
接口：http://127.0.0.1:3000/api/json/mechanismList
|
||
参数：?id=82&page=1
|
||
|
||
|
||
【李康】模特页面点击进去的模特主页
|
||
注意：也要传参数，id
|
||
接口：http://127.0.0.1:3000/api/json/modelList
|
||
参数：?id=3265&page=1
|
||
|
||
|
||
|
||
|