【文件属性】：
文件名称：miniprogram-demo:微信小工具的一些演示
文件大小：20KB
文件格式：ZIP
更新时间：2021-05-29 09:45:09
JavaScript
这个minicode实现了微信小程序的一些常用效果。
自定义顶部导航
滚动锚点 scroll-anchor
实现的功能
顶部切tab，会自动滚动到下方对应内容区域
滚动下方内容区域，顶部tab会随着切换
顶部tab也加了滚动锚点，这样当tab太多被遮挡时，滚动下方内容区域也能让tab动态漏出
图片懒加载
图片出现在可视区域内上浮动画效果
实现方案
锚点的实现需要使用scroll-view组件，设置scroll-into-view属性值为对应节点元素的id。
如果有tab需要在滚动时也进行相应的切换，需要判断节点是否出现在可视区域，此处使用了进行判断(基础库 1.9.3 开始支持)。
图片懒加载的实现使用了IntersectionObserver。
采坑纪要
竖向滚动需要设置其高度，还要避免同时出现页面和区域的滚动条。通常需要设置page的高度为100%或者100vh.然后通过API获取屏幕
【文件预览】：
miniprogram-demo-main
----project.config.json(969B)
----pages()
--------scroll-driven-animation()
--------scroll-anchor()
--------wxs-demo()
----services()
--------mockData.js(8KB)
----components()
--------nav-top()
----app.js(641B)
----assets()
--------icons()
----sitemap.json(191B)
----README.md(2KB)
----app.json(360B)
----app.wxss(0B)