锤子商城

1.web端购物商城

2.包含页面

• 首页
• 列表页
• 详情页
• 购物车
• 登录页
• 注册页

1.首页

• 首页包含头部和底部的复用
• 头部黑色导航栏增加样式
  • 输入时去掉彩色的标签
  • 输入时出现x的符号，点击x可以清空内容
• 黑色导航下方是灰色导航栏复用
  • 灰色导航有二级导航样式
  • 鼠标移入时根据所获取的数据进行渲染
  • 灰色导航解决鼠标移动到二级导航后自动收起bug
• 中间部分数据渲染
  • 根据json数据渲染
  • 根据rap2数据渲染
  • 根据接口数据渲染

2.列表页

• 根据接口数据进行渲染，通过id确定
• 不同的id渲染不同的数据
• 点击列表页商品进入详情页

3.首页热门商品

• 使用json模拟数据渲染

• 数据格式

  {
      "code":"200",
      "msg":"OK",
      "result":[
          {}
      ]
  }

4.列表页和详情页

• 从首页点击导航栏进入列表页，对数据做一些处理，拿到id；
• 通过地址栏传入到list页面，根据id来渲染不同的数据；
• 详情页，找一个放大镜功能的插件；

5.详情页跳转到购物车

• 需要商品名称、数量、价格、图片
• 全选、删除某一条数据、每一条商品的数量加减（选做）
• 数据存在localStorage
  • 一进购物车，先判断localStorage里面有没有数据；
  • 有的话显示；
  • 没有就显示暂无数据；

6.登录注册

• 配置php路径，解决跨域问题
• 判断输入的格式是否正确
• 正确则可以完成注册或进行登录