今日今天今日头条导航栏栏栏旋转怎样手中机手机微信手机微信微信小程序中进行？我查找了在网络上源码，发现有二种进行方式，尽可能的减少不必要的变量，仿写了一下。

原本想从我github马上复制回家，发现兼容问题markdown，尴尬，题型图便是我做下demo完全免费免费下载的，忘掉了便于什么，就当个题型图把

先上一具体实际效果图，二种方式进行的具体实际效果具体上是一样的

重要数据信息信息内容

- 重要的驱动器器数据信息信息内容是currentTab，上下两部分都根据这一数据信息信息内容进行变换

顶部变换设置

- 顶部的旋转，我运用的是flex有效合理布局，原本flex后view长度是100%和显示信息屏一样宽，因而运用width:fit-content,根据内容撑开view

- 顶部左右旋转整个过程中，倘若频道栏目题型沒有显示信息屏内，则移动一格使其进入显示信息屏，原本的辨别方法是依据辨别频道栏目是第许多个进行左右移动，那般的可以进行具体实际效果，可是个小bug，当沒有显示信息屏内的频道栏目题型，拖拽下面内容一一部分使其进入显示信息屏之前，手动式式拖拽顶部的频道栏目，使其出现在显示信息屏内，这时候再拖拽下面内容一一部分，会出現一个晃动，使频道栏目题型在固定不动没动的右边第二个

- 因为其方法是辨别该频道栏目是第许多个，倘若是超过显示信息屏的频道栏目，则移动固定不动没动的间隔，因而会出現晃动，使其在固定不动没动位置

小改进

- 得到顶部sroll-view下面的频道栏目题型变红的dom位置，倘若小于0，则右移，倘若超过显示信息屏总宽，则左移，这时候手动式式拖拽顶部频道栏目，再拖拽下面一一部分，不可易出现顶部频道栏目晃动的bug

- 小重要点，是在修改题型栏变红后，得到该dom的位置

内容一一部分

1. swiper方式

- 依据currentTab和顶部频道栏目进行连动便可以

2. scroll-view方式

- 依据手指头头拖拽恶变恶性事件，得到到坐标，进行前后左右上下对比，获得左划还是右划，修改currentTab进行连动便可以

思考

- 如何进行懒加载?

- 目前的设计构思是当变换的状况下，得到到currentTab，这时候访问后端开发开发设计得到数据信息信息内容，再进行关系显示信息信息内容

仿写设计构思案例实例教程

- 最开始将wxml和wxss复制过去，进行上下都可以旋转具体实际效果

- 之后进行顶部频道栏目旋转的涵数的关系

- 进一步设计方案计划方案下面内容一一部分旋转

- 上下的旋转都由currentTab一总数据驱动器器，因而进行了连动