摘要:本文将带你了解微信小程序开发之学习笔记(二):目录结构,数据展示,希望本文对大家学微信有所帮助。
本文将带你了解微信小程序开发之学习笔记(二):目录结构,数据展示,希望本文对大家学微信有所帮助。
目录结构小程序的基本目录结构如图(1)所示: 图(1)pagespages目录下,每个文件夹代表了一个页面的所有配置,一般情况下每个文件夹下都有四个文件,并且每个文件名都必须和文件夹名相同,只有后缀不同。 - .js文件用来处理每个页面的方法,和我们熟知的js文件作用一样 代码示例: //index.js //获取应用实例var app = getApp()
Page({
data: {
motto: 'Hello World wechat',
userInfo: {}
},
//事件处理函数
bindViewTap: function () {
wx.navigateTo({
url: '../logs/logs'
})
},
bindViewDemo: function () {
wx.navigateTo({
url: '../demo/demo'
})
},
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function (userInfo) {
//更新数据
that.setData({
userInfo: userInfo
})
that.update()
})
}
})123456789101112131415161718192021222324252627282930123456789101112131415161718192021222324252627282930其中data:{}是本页面可以用的数据, 页面上需要调用的方法都必须写到Page({})中。 - .json文件用来管理页面的配置, 具体配置项如下: 表(1)对象类型默认值描述navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如”#000000”navigationBarTextStyleStringwhite导航栏标题颜色,仅支持 black/whitenavigationBarTitleTextString导航栏标题文字内容backgroundColorHexColor#ffffff窗口的背景色backgroundTextStyleStringdark下拉背景字体、loading 图的样式,仅支持 dark/lightenablePullDownRefreshBooleanfalse是否开启下拉刷新(注:这里不设置为true,就无法下拉刷新,backgroundTextStyle的设置也就没有意义)代码示例(注:.json中不能有注释): {
"navigationBarTitleText": "demo"
}123123.wxml文件和html的作用一样,用来编辑页面内容。.wxss的作用和css一样,用来存放class样式。(注:非必须的,可以不要)typings系统自动生成的,不用管了。utils系统自动生成的,不用管了。app.js全局js, 整个APP中都需要使用的方法和变量都可以定义到App({})中,示例代码://app.js
App({
onLaunch: function () {
//调用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)
}
})
}
});
}
},
globalData:{
userInfo:null
}
})
app.json我们通过app.json来配置项目文件的路径、窗口的表现、还有配置多个切换页等。
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之微信频道!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号