『uniapp』搜索功能+商品列表滚动效果（详细图文注释）

目录

• • 预览效果
  • 准备工作
• 代码分析与思路
• • 1. 页面结构
  • • 主容器：`menber-container`
    • 搜索框：`u-search-inner`
    • 菜单：`u-menu-wrap`
  • 2. 数据模型
  • • `data()` 中的数据定义:
  • 3. 生命周期
  • • `onLoad(options)`
    • `onReady()`
    • `mounted()`
  • 4. 方法
  • • `search()`
    • `searchClear()`
    • `swichMenu(index)`
    • `getElRect(elClass, dataVal)`
    • `observer()`
    • `leftMenuStatus(index)`
    • `getMenuItemTop()`
    • `rightScroll(e)`
  • 5. 计算属性
  • • `getIcon(series)`
  • 6. 总结
  • 7. 潜在优化
  • 实现代码
  • 总结