购物商城系统设计与实现总结_商品列表展示页的实现

商品分类展示页面和关键字搜索所显示的商品页面，只是传入的信息不同，重复调用了相同的子组件。子组件为商品列表组件和详细信息组件，点击列表页展示的商品时，跳转到对应商品详情页。列表页用到的分页功能单独制作为分页组件，通过父子组件传值来与商品列表组件联系，点击分页组件的上/下一页以及对应页号时可以展示不同的商品。

商品列表分页功能主要通过数据库查询语句select-limit来实现，点击不同分类时传入对应字段category的值以及预先设定好的展示数量，查询数据库product表将对应数据返回渲染到页面。而搜索功能将用户输入的关键字进行简单处理后，主要通过数据库的模糊查询来实现。

 

用户点击分页组件的不同按钮后，分页组件先进行处理，判断当前显示按钮的样式转变，以及整体的移动让当前显示页按钮时刻位于显示页码的中间部分。点击上一页和下一页时，判断是否有页码可以左右移动。最后再调动商品列表父组件的对应事件pageChange()，请求数据库，切换商品列表显示内容。