发表于： 2017-01-14 01:23:33
1 1248
今天完成的事情：上午继续完善了下表单验证的部分，下午开始看小程序官方文档，并且下载了官方Demo，一个一个看了一遍
明天计划完成的事情：开始做任务11
遇到的问题：官方Demo的js写法有很多看不太懂
收获：
1.小程序初始化并包含了一些简单的代码文件。最关键也是必不可少的，是 app.js、app.json、app.wxss 这三个。其中，.js后缀的是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件。微信小程序会读取这些文件，并生成小程序实例
2.app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API，如本例的同步存储及同步读取本地数据。
3.app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景色，配置导航条样式，配置默认标题。注意该文件不可添加任何注释
4.app.wxss 是整个小程序的公共样式表。我们可以在页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则。
5.每一个小程序页面是由同路径下同名的四个不同后缀文件的组成，如：index.js、index.wxml、index.wxss、index.json。.js后缀的文件是脚本文件，.json后缀的文件是配置文件，.wxss后缀的是样式表文件，.wxml后缀的文件是页面结构文件。
6.页面的样式表是非必要的。当有页面样式表时，页面的样式表中的样式规则会层叠覆盖 app.wxss 中的样式规则。如果不指定页面的样式表，也可以在页面的结构文件中直接使用 app.wxss 中指定的样式规则。同理：页面的配置文件是非必要的。当有页面的配置文件时，配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件，则在该页面直接使用 app.json 中的默认配置。
框架：
1.核心：相应的数据绑定系统
系统分为两块：视图层（View ）和逻辑层（App Service）
框架可以让数据与视图非常简单地保持同步。当做数据修改的时候，只需要在逻辑层修改数据，视图层就会做相应的更新。
2.页面管理：框架 管理了整个小程序的页面路由，可以做到页面间的无缝切换，并给以页面完整的生命周期。开发者需要做的只是将页面的数据，方法，生命周期函数注册进 框架 中，其他的一切复杂的操作都交由 框架 处理。
3.基础组件：
框架 管理了整个小程序的页面路由，可以做到页面间的无缝切换，并给以页面完整的生命周期。开发者需要做的只是将页面的数据，方法，生命周期函数注册进 框架 中，其他的一切复杂的操作都交由 框架 处理。
4.丰富的API
框架 提供丰富的微信原生 API，可以方便的调起微信提供的能力，如获取用户信息，本地存储，支付功能等。
5.文件结构：
一个小程序的主体部分由三个文件组成，必须放在项目的根目录下：
app.js、app.josn、app.wxss前两者必填
一个小程序页面有四个文件组成，分别是：
js 必填 页面逻辑
wxml 必填 页面及饿哦股
wxss 非必填 页面样式表
json 非必填 页面配置
6.配置：
我们使用app.json文件来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。
基础组件：框架为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行快速开发。
1.什么是组件？
- 组件是视图层的基本组成单元。
- 组件自带一些功能与微信风格的样式。
- 一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内。
2.属性类型：
Boolean 布尔值 足尖上写该属性，不管该属性等于什么，其值都为true，只有组件上没有写该属性时，属性值才为false。如果属性值为变量，变量的值会被转换成Boolean类型。
Numer 数字
String 字符串 “string”
Array 数组 [1,"string"]
Object 对象 { key: value }
EventHandler 事件处理函数名 "handerName" 是Page中定义的事件处理函数名
Any 任意属性
3.共享属性类型
所有组件都共有的属性：
id String 组件的唯一表示 保持整个页面唯一
class String 组建的样式类 在对应的WXSS中定义的样式类
style String 组件的内联样式 可以动态设置的内联样式
hidden Boolean 组件是否显示 所有组件默认显示
data-* Any 自定义属性 组件上出发的事件时，会发送给事件处理函数
bind* / catch* EventHandler 组建的事件
4.组件列表
基础组件分为以下七大类：
视图容器（View container）
view 视图容器
scorll-view 可滚动式图容器
swiper 滑块视图容器
基础内容 （Basic Content）：
icon 图标
text 文字
progress 进度条
表单（Form）：
button 按钮
form 表单
input 输入框
checkbox 多项选择器
radio 单项选择器
picker 列表选择器
picker-view 内嵌列表选择器
slider 滚动选择器
switch 开关选择器
label 标签
导航（Navigation）：
navigator 应用链接
多媒体（Media）：
audio 音频
image 图片
video 视频
地图（Map）：
map 地图
画布（Canvas）：
canvas
客服电话：
contact-button 进入客服会话按钮
返回列表
评论