响应数据绑定
整个小程序框架系统分为两部分:逻辑层(App Service)和 视图层(View)。
WXML中写:
- {{}},双大括号括起来的是变量。
- button按钮绑定了一个触发事件。
JS中写:
此部分可以在官方的文档中查看。下面做以下解释:
•开发者通过框架将逻辑层数据中的 name 与视图层的 name 进行了绑定,所以在页面一打开的时候会显示 Hello WeChat!;
•当点击按钮的时候,视图层会发送 changeName 的事件给逻辑层,逻辑层找到并执行对应的事件处理函数;
•回调函数触发后,逻辑层执行 setData 的操作,将 data 中的 name 从 WeChat 变为 MINA,因为该数据和视图层已经绑定了,从而视图层会自动改变为 Hello MINA!。
默认基础结构
app.wxss
类似与HTML5中的CSS,控制样式。支持class选择器,ID选择器等。
app.json
公共配置文件,对微信小程序进行全局的配置。
-
“pages”表示页面的路径,在pages文件夹中。一般创建项目之后,删除无用logs。可以在微信小程序官方文档中,查看全局配置,有对json更详细的解释。pages中,第一行的页面为微信小程序的默认首页。
-
"window"表示窗口的样式,属性值可在文档中查看。for example: "navigationBarTextStyle"只能设置“black”“white。
”PS:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#window
-
"tabbar"是底部tab栏的表现。是很重要的一个属性,但json文档中没有写,需要我们自己手动书写。利用微信开发者工具的自动补全功能可以很好的实现,注意书写时不要加引号,才会出现自动补全。list中的图标个数2-5,自动补全之后只有一个,需要手动添加,否则,console后依然会报错。
iconpath中指定的图标,有很严格的限制。icon 大小限制为 40kb,建议尺寸为 81px * 81px,不支持网络图片。
app.js
公共属性和方法。
-
project.config.json:项目配置文件。一般不动。
|
请发表评论