微信小程序实现单页面内切换不同分页的实现思路

思路A：当页面内需要分页时，可以将每个分页分别使用view包裹，通过点击导航栏内不同

分页名的方式控制分页view的display属性控制“分页”的显示或隐藏，这种方法实际上所有分页都

在当前页面内，只是在显示的时候只显示一个。

思路B：当页面内需要多个分页而且其它页面也需要使用时可以使用Component自定义组件的

功能，将每个分页的单独页面做成组件，在需要使用的页面引用组件即可，将组件包裹在view

中，使用display属性控制分页的显示隐藏；具体的创建自定义组件方法可以参考https://www.jianshu.com/p/34dea82fc312

 

优化显示方式：直接使用display控制分页显示隐藏时，整个页面直接消失显示，没有缓冲。可以

将分页的view或者分页的组件放在swiper-item中，使用swiper控制分页的显示，将swiper的滚动

方式设置为横向滚动，隐藏分页的小点点，使用swiper的bindchange控制导航栏内分页名的高亮

位，点击分页名时修改swiper的current切换分页。这样优化过后不再只能通过点击导航栏分页名

的方式进行分页切换，新增了可以左右滚动切换分页的方式，优化了用户体验