//app.js
app({
onLaunch: function(){
}
})
//app.json
{
"pages":[
"pages/index/index"
],
"windows" : {
"backgroundTextStyle" : "light"
}
}
//app.wxss
.container {
height: 100%
}
<!--index.wxml-->
<view class="container">
<view bindtap="bindViewTap">
<text>{{msg}}</text>
</view>
</view>
//index.js
Page({
data:{
msg:'hello'
},
bindViewTap:function(){
this.setData({
msg:'hello world'
})
}
})
MINA框架:
封装微信客户端:文件系统(获取手机照片),网络通信(请求服务端数据),任务管理(打开扫一扫)等,对上层提供一整套javascript API。如下图:
目录结构:
demo1
<!-- This is our View -->
<view>Hello {{name}}!</view>
<button bindtap="changeName">Click me!</button>
// This is our App Service.
// This is our data.
const helloData = {
name: 'WeChat'
}
// Register a Page.
Page({
data: helloData,
changeName(e) {
// sent data change to view
this.setData({
name: 'MINA'
})
}
})
1.逻辑层数据的name和视图层数据的name绑定;
2.点击按钮,视图层会发送changeName的事件,到逻辑层;
3.逻辑层进行setData操作,data中的name属性改变。因为数据和视图层已经绑定,从而视图层会自动改变为:Hello MINA