recycle-view 常列表实战

昨天拿到一个需求

分解需求：

0. 自定义标题栏
1. 搜索框禁用，做点击跳转到搜索详情页
2. 分类，左右滑动
3. 点击菜单展示所有分类
4. tabs吸顶
5. 常列表

需求是老项目新增需求，前期类似的需求都是手写原生，后期用了vant Ui。维护好难-。-，标题栏统一处理忽略，接下来就是处理 vant ui 和 常列表，先对着原型撸个demo，代码片段在最后。

vant ui

之前打包已经2M多了，在用一个ui框架的话后期维护真的。。所以继续 vant ui

使用的组件 index.json

 // dropdown-menu 待定
{
  "usingComponents": {
    "recycle-view": "miniprogram-recycle-view/recycle-view",
    "recycle-item": "miniprogram-recycle-view/recycle-item",
    "van-tab": "@vant/weapp/tab/index",
    "van-tabs": "@vant/weapp/tabs/index",
    "van-dropdown-menu": "@vant/weapp/dropdown-menu/index",
    "van-dropdown-item": "@vant/weapp/dropdown-item/index",
    "van-icon": "@vant/weapp/icon/index",
    "van-popup": "@vant/weapp/popup/index",
    "van-search": "@vant/weapp/search/index"
  }
}

代码片段：https://developers.weixin.qq.com/s/1ZmiCGm87qdb

删除了node_modules,太大了超过一M不能上传代码片段，会报错请忽略，介意的话 npm 重新安装走一遍。

总结

有点儿短～

想水一篇文章的，发现没得写。。。水文