微信小程序页面搭建与定位功能实现（含Tabbar）
小程序的页面初搭其实不复杂，重点是理清结构和定位几个核心功能。像页面结构、Tabbar 配置，还有地图和定位功能，基本是每个项目都会用到的，搞懂了就能快速起手一个小项目了。
页面的结构挺标准的，一个.json配置文件+.wxml布局+.wxss样式+.js逻辑文件，几个文件分工明确，配合起来还挺高效。
Tabbar的搭建主要在app.json里配置，像图标路径、选中颜色啥的都能调，有的同学喜欢搞个自定义的，也可以配合组件系统去实现，灵活性还不错。
地图功能这块，小程序原生就支持地图组件，挺方便的。直接在wxml里用，配上longitude、latitude就能显示你要的位置。想要拿到用户的当前位置，记得用wx.getLocation，把坐标塞进地图里就行。
标注也简单，用markers数组搞定，想加多个点也是支持的。要算两个点的距离？腾讯地图的getDistance接口就派上用场了，传俩坐标就给你距离，单位是米。
权限管理得注意，小程序现在对隐私抓得紧，记得提前wx.authorize求一下位置权限，用户不同意就不能搞定位。出错了也别慌，像定位失败、网络异常啥的，加个容错逻辑就能兜底。
地图这玩意儿数据一多就容易卡，别啥都一次性加载，建议做点懒加载，性能会好多。交互上也别忽略了，用户点个位置、缩放一下，最好有点反馈，体验才会舒服。
如果你刚上手小程序开发，或者正好在做跟地图、导航相关的功能，这篇内容还挺值得一看，多坑都提前帮你避了。
文件大小：1.03MB
评论区