0
0
0
原生微信小程序
文章摘要
|
微信小程序原生开发
一、页面的全局配置
{
// pages存放所有的页面的路径
"pages": [
"pages/index/index",
"pages/home/home"
],
// 整个页面的配置
"window": {
"navigationBarBackgroundColor": "#FFDAB9", //导航条背景颜色
"navigationBarTextStyle": "black", //小程序名字的字体颜色
"navigationBarTitleText": "李业" // 小程序名字
},
//导航栏（至少需要两个元素）
"tabBar": {
"selectedColor":"#CD5C5C", //设置选中的图标的颜色
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "static/tabbar/ic_menu_choice_nor.png",
"selectedIconPath": "static/tabbar/ic_menu_choice_pressed.png"
},
{
"pagePath": "pages/home/home",
"text": "我的",
"iconPath": "static/tabbar/ic_menu_me_nor.png",
"selectedIconPath": "static/tabbar/ic_menu_me_pressed.png"
}
]
}
}
标签的使用
1、view标签类似于div标签
2、text 标签类似于p标签
3、image 图片标签
4、页面布局时，样式大小，使用rpx ---- css中使用的是px
数据的操作
home.wxml页面
<view>{{ msg }}</view>
<view wx:for="{{list}}"> {{item.id}}- {{item.name}}-{{item.intrudtion}}</view>
<view wx:for="{{stu}}">{{index}} - {{item}}</view>
home.js页面
Page({
data:{
stu:['张三','李四'],
list:[
{
id:1,
name:"张三",
intrudtion:'计算机'
},
{
id:2,
name:"张三",
intrudtion:'汉语言'
},
],
msg:'小拾爱分享'
}
})
分包
普通分包
{
// pages存放所有的页面的路径
"pages": [
"pages/index/index",
"pages/home/home"
],
//分包
"subpackages":[
{
"root": "packagesA",//分包A
"name": "p1",//别名
"pages": [
"pages/login/login"
]
},
{
"root": "packagesB",
"name": "p2",
"pages": [
"pages/reg/reg"
]
}
],
// 整个页面的配置
"window": {
"navigationBarBackgroundColor": "#FFDAB9", //导航条背景颜色
"navigationBarTextStyle": "black", //小程序名字的字体颜色
"navigationBarTitleText": "李业" // 小程序名字
},
//导航栏（至少需要两个元素）
"tabBar": {
"selectedColor":"#CD5C5C", //设置选中的图标的颜色
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "static/tabbar/ic_menu_choice_nor.png",
"selectedIconPath": "static/tabbar/ic_menu_choice_pressed.png"
},
{
"pagePath": "pages/home/home",
"text": "我的",
"iconPath": "static/tabbar/ic_menu_me_nor.png",
"selectedIconPath": "static/tabbar/ic_menu_me_pressed.png"
}
]
}
}
独立分包
{
"pages": [
"pages/home/home",
"pages/index/index",
"pages/life/life"
],
"subpackages":[
{
"root": "packagesA",
"name": "p1",
"pages": [
"pages/login/login"
]
},
{
"root": "packagesB",
"name": "p2",
"pages": [
"pages/reg/reg"
],
"independent": true//添加该属性为独立分包
}
],
"window": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "智慧社区",
"navigationBarBackgroundColor": "#ffffff"
},
}
分包下载
{
"pages": [
"pages/home/home",
"pages/index/index",
"pages/life/life"
],
//分包下载
"preloadRule": {
"pages/home/home":{//打开某个页面，下载分包p1
"packages": [
"p1"//需要下载的分包的名称
],
"network": "all"//下载的网络请求方式WiFi或者all
}
},
"subpackages":[
{
"root": "packagesA",
"name": "p1",
"pages": [
"pages/login/login"
]
},
{
"root": "packagesB",
"name": "p2",
"pages": [
"pages/reg/reg"
],
"independent": true
}
],
}