一步步开发微信小程序

Posted 2020-09-02 Darren-chen

今天做的是这个页面

 

先说一下顶部的注意点：顶部的导航栏的创建

 

分别给热门笑话和经典笑话绑定不同的事件，通过点击改变js中声明的currentSelectedNavBar
变量，再通过这个变量的值改变去改变控件的class属性，从而可以重新设置他们的样式。下面是设置样式部分

注意点：顶部是固定不动的，所以要用到position: fixed;属性，在测试的过程中发现scrollView滚动到一定的位置后顶部的控件会变成透明，原因是顶部控件没有设置具体的高度，所以height: 40px;这个属性不能省略，还有一个现象就是scrollView会盖住顶部的控件，所以设置了z-index: 9999;这个属性，让顶部控件始终展示在最前面。

cell的样式都是很基本的思路，还有网络请求部分的demo具体请看源码，源码地址：http://git.oschina.net/darrenchen/xiaochengxu_leilema