设置启动页
app.json文件中,pages下的第一个就是默认的启动页
"pages":[
"pages/star/star",
"pages/home/home",
"pages/index/index",
"pages/logs/logs"
],
快速创建页面
app.json文件中,pages下新增一条记录
pages/XX/XX
,就会自动在pages目录下创建一个XX的文件夹,并同步生成对应的文件【js/json/wxml/wxss】
修改顶部banner的背景色、文案颜色
在app.json中修改
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#FECE00",
"navigationBarTitleText": "testDemo",
"navigationBarTextStyle":"#fff"
},
设置底部导航页签
设置像app一样的顶部导航页签,在app.json文件中增加
tabBar
"tabBar": {
"backgroundColor":"#FECE00",//背景色
"color": "#fff", //文字颜色
"selectedColor": "#fff",//选中后的文字颜色
"position":"bottom",
"list": [
{
"selectedIconPath": "assets/icon/home_active.png",
"iconPath": "assets/icon/home.png",
"pagePath": "pages/home/home",
"text": "首页"
},
{
"selectedIconPath": "assets/icon/item_active.png",
"iconPath": "assets/icon/item.png",
"pagePath": "pages/star/star",
"text": "分类"
},
{
"selectedIconPath": "assets/icon/integral_active.png",
"iconPath": "assets/icon/integral.png",
"pagePath": "pages/logs/logs",
"text": "积分"
},
{
"selectedIconPath": "assets/icon/user_active.png",
"iconPath": "assets/icon/user.png",
"pagePath": "pages/home/home",
"text": "用户"
}
]
}
修改某一个页面的title
在对应的pages目录下找到该页面对应的json文件,修改
# pages/home/home.json
{
"navigationBarTitleText": "首页"
}
点击事件传递参数
dom元素上的事件不支持携带参数,但是可以用data-*绑定到dom上,在事件中或许元素上的属性值
注意:text不支持点击事件
<view bindtap="changeLabel" data-index="1">
<text class="{{searchParmas.type==1?'active':''}}" >优质推荐</text>
</view>
// 改变label值
changeLabel(event){
this.setData({
searchParmas: {
type: event.currentTarget.dataset.index
}
})
},
条件判断,动态设置样式
<text class="{{searchParmas.type==1?'active':''}}" >优质推荐</text>