很多初学微信小程序语法的同学,可能不知道如何布局和搭建一个项目,下面我将讲解初学者如何搭建项目和注意事项。
一、 app.json的配置
{"pages": ["pages/index/index","pages/classification/classification","pages/find/find","pages/shoppingcart/shoppingcart","pages/mine/mine"],"window": {"navigationBarTextStyle": "black","navigationBarTitleText": "心理健康服务平台","navigationBarBackgroundColor": "#ffffff","homeButton": true,"navigationStyle": "default","backgroundColor": "#999999","backgroundTextStyle": "dark","backgroundColorTop": "#f1f1f1"},"style": "v2","sitemapLocation": "sitemap.json","lazyCodeLoading": "requiredComponents","tabBar": {"selectedColor": "#fa6722","borderStyle": "white","list": [{"pagePath": "pages/index/index","text": "首页","iconPath": "assets/icons/home.png","selectedIconPath": "/assets/icons/home_active.png"},{"pagePath": "pages/classification/classification","text": "分类","iconPath": "assets/icons/category.png","selectedIconPath": "assets/icons/category_active.png"},{"pagePath": "pages/find/find","text": "发现","iconPath": "assets/icons/discovery.png","selectedIconPath": "assets/icons/discovery_active.png"},{"pagePath": "pages/shoppingcart/shoppingcart","text": "购物车","iconPath": "assets/icons/cart.png","selectedIconPath": "assets/icons/cart_active.png"},{"pagePath": "pages/mine/mine","text": "我的","iconPath": "assets/icons/mine.png","selectedIconPath": "assets/icons/mine_active.png"}]}
}
1. navigationBarTextStyle
-
作用:设置导航栏文本的颜色。
-
取值:
"black"
:文本为黑色。"white"
:文本为白色。
2. navigationBarTitleText
-
作用:设置导航栏的标题文本。
3. navigationBarBackgroundColor
-
作用:设置导航栏的背景颜色。
4. homeButton
-
作用:是否显示系统的“主页”按钮。对于iOS设备,系统会自动显示一个主页按钮。
5. navigationStyle
-
作用:设置导航栏的样式。
-
取值:
"default"
:使用默认样式。"custom"
:自定义样式(通过navigation
组件进行设置)。
6. backgroundColor
-
作用:设置整个页面的背景颜色。
-
取值:一个十六进制的颜色值。
这里设置为
"#999999"
,即页面的背景颜色为浅灰色。
7. backgroundTextStyle
-
作用:设置下拉刷新时的背景文本样式。
-
取值:
"light"
:文本为浅色。"dark"
:文本为深色。
8. backgroundColorTop
-
作用:设置下拉刷新时顶部背景的颜色。
-
取值:一个十六进制的颜色值。
这里设置为
"#f1f1f1"
,意味着下拉刷新时,顶部背景的颜色为浅灰色。