最近移动端的任务完成了，正好赶上小程序公测。作为一个iOS开发的弱鸡，已经准备接受web同行的疯狂吐槽了。
app.js
//app.js
App({
onLaunch: function () {
},
getUserInfo:function(cb){
},
globalData:{
userInfo:null
}
})
|
看到onLaunch我们很容易联想到 appdelegate中的- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(nullable NSDictionary *)launchOptions都是程序加载的嘛
上面是 js 的语法，我稍微解释一下app()是程序的入口传入的app的一个对象
在js 中
{
onLaunch: function () {
},
getUserInfo:function(cb){
},
globalData:{
userInfo:null
}
}
|
这就是一个对象， onLaunch不用说，下面的2个方法都市我们为这个对象添加的方法。
在其他地方我们可以获取这个全局对象
var app = getApp()
这个就和[UIApplication sharedApplication]差不多。
不过这里区别的是 iOS是指定了代理，而小程序这边是自己创建一个app的对象。
app.json
这个json文件就相当于配置文件，针对一些全局配置
{
"pages":[
"pages/index/index",
"pages/mine/mine"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "24爱购",
"navigationBarTextStyle":"black"
},
"tabBar": {
"color": "#dddddd",
"selectedColor": "#3cc51f",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "images/icon_component.png",
"selectedIconPath": "images/icon_component_HL.png"
},
{
"pagePath": "pages/mine/mine",
"text": "我的",
"iconPath": "images/icon_API.png",
"selectedIconPath": "images/icon_API_HL.png"
}]
},
"networkTimeout": {
"request": 10000,
"connectSocket": 10000,
"uploadFile": 10000,
"downloadFile": 10000
},
"debug": true
}
|
1.pages 和iOS不同，在小程序中所有的页面都需要注册。不注册跳转的就会报错。
2.window和tabbar 这个就不用多说了，大家看上面的字面意思就能力理解
3.networkTimeout 网络请求的超时时间
app.wxss
这个就是一个css的加强版，在我们iOS中就是layout的代码。
在这里写的css 都是全局的
开始撸页面
我们知道我们在写iOS程序的时候一般都是分MVC的，在小程序对于一个页面一般有3类文件wxml,js,wxss . 对于wxml就等同于我们的view，js就等同于我们的model和controller，而wxss就是把view中的layout单独提取出来。
这样分，我感觉应该很清楚了。
我们现在就就撸一个tabbleview 练练手
可是在小程序中没有列表这种view，我们只有用for循环来渲染拉
<view class="mine-item-list">
<block wx:for="{{itemArray}}">
<view class="mine-item">
<image class="mine-item-img" src="{{item['img']}}"></image>
<text class="mine-item-name">{{item["name"]}}</text>
<image class="mine-item-arrow" src="../../images/arrowright.png"></image>
</view>
</block>
</view>
|
对了，我要提一下。这个wxml就和html没什么区别，view看成div
