添加 douban 项目
（2）进入 app.json 文件里，添加“pages/movie/movie” “pages/cinema/cinema” “pages/me/
me”“pages/movieDetail/movieDetail”4 个文件路径，删除默认创建的 index、logs 文件路径，将窗口
导航栏背景色设置为黑色（#1A1A1A），导航标题为豆瓣电影，文字颜色设置为白色（white），具体代码
如下所示。
{
"pages": [ "pages/movie/movie",
"pages/cinema/cinema", "pages/me/me",
"pages/movieDetail/movieDetail"
],
"window": { "backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#1A1A1A",
"navigationBarTitleText": " 豆 瓣 电 影 ", "navigationBarTextStyle":
"white"
}
}
（3）进入 movie.wxml 文件里，采用 view 视图容器来布局顶部的 3 个页签。需要设置两种样式，一种是
选中样式 select，另外一种是正常样式 normal。定义 currentTab 变量与页签索引值做比较，id 为索引值，
添加 switchNav 绑定事件，具体代码如下所示。
<view class="nav">
<view id="0" class="{{currentTab == 0?'select':'normal'}}" bindtap="switchNav">上映</view>
<view class="line">|</view>
<view id="1" class="{{currentTab == 1?'select':'normal'}}" bindtap="switchNav">影院</view>
<view class="line">|</view>
<view id="2" class="{{currentTab == 2?'select':'normal'}}" bindtap="switchNav">我看</view>
</view>
（4）进入 movie.wxss 文件里，给 nav、select、normal、line 这 4 个 class 添加样式，具体代码如下
所示。
.nav{
display: flex;
flex-direction: row; background-color:
#222222;
}
.select{
width: 32%; height:45px;
line-height: 45px; text-align: center;
color:#ffffff;
font-size: 13px;
border-bottom: 10
风险管理课程教学进程表
4
评论0
最新资源