首先从大的方面来讲，就是设置了window的属性
"navigationBarBackgroundColor": "#AFE2E6",//bar背景颜色 "navigationBarTextStyle": "white",//bar字体颜色 "backgroundColor": "white",//背景颜色 "enablePullDownRefresh": "true"//下拉是否刷新
tabBar属性
完整代码如下（wxml）
<view> <navigator url='/pages/14/1'> <view> <view>1</view> <view>广从1号线</view> <view>市汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> <navigator url='/pages/14/2'> <view> <view>2</view> <view>广从2号线</view> <view>芳村汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> <navigator url='/pages/14/3'> <view> <view>3</view> <view>广从3号线</view> <view>罗冲围汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/4'> <view> <view>4</view> <view>广从4快号线</view> <view>天河客运站 -从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> <navigator url='/pages/14/5'> <view> <view>4</view> <view>广从4线</view> <view>天河客运站 -从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> <navigator url='/pages/14/6'> <view> <view>5</view> <view>广从5号线</view> <view>东站汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> <navigator url='/pages/14/7'> <view> <view>6</view> <view>广从6号线</view> <view>东圃客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/8'> <view> <view>7</view> <view>广从7号线</view> <view>黄埔客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/9'> <view> <view>8</view> <view>广从8号线</view> <view>广园汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/10'> <view> <view>8</view> <view>广从8快线</view> <view>广园汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/11'> <view> <view>9</view> <view>广从9号线</view> <view>滘口汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/12'> <view> <view>10</view> <view>广从10号线</view> <view>越秀南客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/13'> <view> <view>10</view> <view>广从10快线</view> <view>越秀南客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> <view>></view> </view> </navigator> <navigator url='/pages/14/14'> <view> <view>11</view> <view>广从11号线</view> <view>海珠汽车客运站-从化汽车站</view> <image src="https://www.jb51.net/assets/images/subway.jpg" /> </view> </navigator> </view>
wxss
.waylist{ display: flex; border-bottom: 1px solid gray; font-size: 13px; } .waylist view{ height:40px; line-height: 40px; } .waylist .im{ width: 25px; height: 25px; line-height: 25px; text-align: center; color:white; margin-top: 7.5px; margin-right: 5px; border-radius: 50px; margin-left: 5px; } .ste{ color:gray; text-align: left; font-size: 12px; width: 60%; } .way{ width: 30%; } .jian{ text-align: right; font-size: 20px; color:gray; } .hidden{ visibility: hidden; } image{ margin-top:5px; } .im1{ } .im2{ } .im3{ } .im4{ } .im5{ } .im6{ } .im7{ } .im8{ } .im9{ } .im10{ } .im11{ }
json文件
{ "navigationBarTitleText": "所有广从线"//bar内容 }
js文件