微信小程序app配置指南
//app.json页面
{
//页面注册,有几个页面都要在pages里面注册
"pages":[
"pages/index/index",
"pages/logs/logs",
"pages/main/main",
"pages/main1/main1",
"pages/main2/main2",
"pages/main3/main3",
],
//上导航配置及app背景颜色设置
"window":{
//是否开启下拉刷新
"enablePullDownRefresh":true,
//窗口背景颜色,在上拉刷新,下拉刷新,navigate切换页面时可以看见
"backgroundColor":"#eee",
//下拉背景字体、loading 图的样式,仅支持 dark/light,(string形式)
"backgroundTextStyle":"light",
//上导航条背景颜色
"navigationBarBackgroundColor": "orange",
//上导航标题文字
"navigationBarTitleText": "上导航标题文字",
"navigationBarTextStyle":"white" //上导航标题字体颜色,仅支持white和black
},
//底部导航配置
"tabBar": {
"color": "#a9b7b7",//导航字体默认颜色
"selectedColor": "#eb4f38",//导航字体选中时颜色
"borderStyle": "black", //上border颜色,仅支持 black/white(string形式)
"backgroundColor": "rgba(0,0,0,0.4)",//底部导航背景色
"list": [ //导航列表2-5个
{
"pagePath": "pages/index1/index1", //每个导航的网页对应的路径
"text": "首页", //标题
"iconPath": "images/wechat.png", //默认小图标路径
"selectedIconPath": "images/wechatHL.png" //选中时的小图标路径
},
{
"pagePath": "pages/index2/index2",
"text": "日记",
"iconPath": "images/pause.png",
"selectedIconPath": "images/play.png"
},
{
"pagePath": "pages/index3/index3",
"text": "指南",
"iconPath": "images/pause.png",
"selectedIconPath": "images/play.png"
},
]
},
//网络请求超时时间
"networkTimeout": {
"request": 10000,
"downloadFile": 9000,
"uploadFile":8000,
"connectSocket":7000
},
//是否开启debug模式
"debug": true
}
//说明:根据官方文档,上述color和bg-color类型为HexColor即16进制类型,(指定仅支持 black/white,string形式的除外),但实测rbg,rgba和red这些类型目前也支持,但是建议大家还是按文档要求来设置为16进制类型即: #ffffff 类型;
//
//使用时仅需将文件复制下来,根据需求改动即可;
//
//app.json为标准的json文件,所以不能存在有注释,使用的时候需把注释去掉;
//app.js页面
App({
//当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
onLaunch: function () {
//onLaunch时调用API从本地缓存中获取数据
var logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
},
//获取用户登录信息
getUserInfo:function(cb){
var that = this
if(this.globalData.userInfo){
typeof cb == "function" && cb(this.globalData.userInfo)
}else{
//调用登录接口
wx.login({
success: function () {
wx.getUserInfo({
success: function (res) {
that.globalData.userInfo = res.userInfo
typeof cb == "function" && cb(that.globalData.userInfo)
}
})
}
})
}
},
//获取后台数据
onshow:function(){
wx.request({
url: 'test.php',
data: {
x: 'xxx',
y: 'yyy'
},
header: {
'Content-Type': 'application/json'
},
success: function(res) {
console.log(res.data)
}
})
},
//设置全局数据
//本页面通过this.globalData即可取得数据
globalData:{
userInfo:null
}
//其他页面可以通过getApp()获取到小程序实例
//其他页面可以通过getApp().globalData.xxx获取到全局数据
})
//app.wxss页面
.common {
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
padding: 200rpx 0;
box-sizing: border-box;
}
//仅支持:
类:.common
ID:#common
标签:common
多个标签:common1,common2
伪类::after
伪类::before
//不支持层级,如.common > view 或者.common view
//引入新的单位rpx:
rpx(responsive pixel): 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。
及新的rem:
rem(root em): 规定屏幕宽度为20rem;1rem = (750/20)rpx 。
//写在app.wxss里面的样式将被设置为公有的,对于其他页面都是可用的
微信小程序app配置指南的更多相关文章
- 微信小程序 app.json 配置
我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. 以下是一个包含了所有配置选项的简单配置app.json : { " ...
- 微信小程序app.json文件常用全局配置
小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. JOSN文件不允许注释,下面为了学习加上注释,粘贴需要的片段 ...
- 微信小程序 | app.json配置属性
app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. widows: 用于设置小程序的状态栏.导航条.标题.窗口背景色. navig ...
- 两百条微信小程序跳坑指南(不定时更新)
微信小程序联盟出品 跳坑textarea<二百二十三>不显示文本及textarea相关问题集合跳坑<二百一十三> background-image无法获取本地资源图片....跳 ...
- 微信小程序day01-JSON配置
微信小程序 小程序代码构成 JSON配置WXML模板WXSS样式JS逻辑 1.JSON配置 小程序配置 app.json app.json: 是当前小程序的全局配置,包括了小程序的所有页面路径.界面表 ...
- 微信小程序环境配置和开发!!
1.登陆微信公众平台小程序,下载 普通小程序开发者工具.或者 小游戏开发者工具. 2.新建项目需要填以下几点,然后初始demo如下,注意rpx是分成750份的单位. 3.点击预览,用微信扫描二维码,代 ...
- 微信小程序的配置详解
1.配置详解: 使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置多 tab 等. 1>pages 接受一个数组,每一项都是字符串,来指定小 ...
- 微信小程序-APP生命周期与运行机制
QQ讨论群:785071190 开发微信小程序之前需要先了解微信小程序运行机制以及其生命周期,小程序APP生命周期需要先从app.js这个文件开始. 阅读过"微信小程序-代码构成" ...
- 微信小程序https配置
先简单说下什么是https,https与http区别 ,以及https的原理 什么是https 在说HTTPS之前先说说什么是HTTP,HTTP就是我们平时浏览网页时候使用的一种协议.HTTP协议传输 ...
随机推荐
- cbv
- 【WIN10】使用自己的PageLoader加載Page
源碼下載:http://yunpan.cn/cFwwrT4V5rHIM 访问密码 1b97 在上一篇博客中,我已經說明了為什麼要自己寫一個PageLoader.原因就是,Frame的GoBack只是 ...
- springboot配置多数据源mongodb
参考大佬的文章 https://juejin.im/entry/5ab304dd51882555825241b3
- BZOJ3611 HEOI2014大工程
先建虚树,然后统计答案. 对于这个两点间最大值和最小值的操作我参考了hzwer的代码. 建虚树时注意判自环 By:大奕哥 #include<bits/stdc++.h> using nam ...
- BZOJ.3110.[ZJOI2013]K大数查询(整体二分 树状数组/线段树)
题目链接 BZOJ 洛谷 整体二分求的是第K小(利用树状数组).求第K大可以转为求第\(n-K+1\)小,但是这样好像得求一个\(n\). 注意到所有数的绝对值\(\leq N\),将所有数的大小关系 ...
- SQL SERVER中获取表间主外键关系
sql server 2008中的主外键关系获取方式: 转自:http://www.cnblogs.com/ke10/archive/2012/06/11/2544655.html SELECT OB ...
- bzoj 3671 贪心
想到了从小到大依次填,但想到可能有重复元素,那是就会有分支,就不知怎样办了,最后才发现它是用随机数来调整排列,所以没有重复元素,唉..... /**************************** ...
- ZOJ 2970 Faster, Higher, Stronger
F - Faster, Higher, Stronger Time Limit:2000MS Memory Limit:65536KB 64bit IO Format:%lld &am ...
- Codeforces Round #279 (Div. 2) A. Team Olympiad 水题
#include<stdio.h> #include<iostream> #include<memory.h> #include<math.h> usi ...
- php在linux后台执行
<?php ignore_user_abort();//后台运行 ini_set('default_socket_timeout', -1);//socket不超时 set_time_limit ...