微信小程序

微信小程序BREADPPTDESIGN小程序包含一个描述整体程序的app和多个描述各自页面的page。一个小程序主体部分由三个文件组成，必须放在项目的根目录，如下：app.jsapp.jsonapp.wxss•必需•小程序逻辑•必需•小程序公共设置•非必需•小程序公共样式BREADPPTDESIGN一个小程序页面由四个文件组成，分别是：（页面的这四个文件必须具有相同的路径与文件名）js•必需•页面逻辑wxml•必需•页面结构wxss•非必需•页面样式json•非必需•页面配置BREADPPTDESIGNapp.json配置pages•必需•页面路径window•非必需•页面窗口表现tabBar•非必需•设置tabdebug•非必需•可以在开发者工具中开启debug模式networkTimeout•非必需•设置各种网络请求的超时时间BREADPPTDESIGNpages•数组形式，每一项对应一个页面【路径+文件名】。•不需要后缀名。BREADPPTDESIGNwindow•用于设置小程序的状态栏、导航条、标题、窗口背景色•navigationBarBackgroundColor：导航栏背景颜色（十六进制）•navigationBarTextStyle：导航标题颜色（仅支持black/white）•navigationBarTitleText：导航标题•backgroundColor：窗口背景色（十六进制）•backgroundTextStyle：下拉背景字体、loading图的样式，仅支持dark/light•enablePullDownRefresh：是否开启下拉刷新BREADPPTDESIGNtabBar•tabBar是一个数组，只能配置最少2个、最多5个tab，tab按数组的顺序排序。•color：tab上的文字默认颜色（十六进制）•selectedColor：tab上的文字选中时的颜色（十六进制）•backgroundColor：tab的背景色（十六进制）•borderStyle：tabbar上边框的颜色，仅支持black/white•list：数组•pagePath：页面路径，必须在pages中先定义•text：tab上按钮文字•iconPath：图片路径，icon大小限制为40kb•selectedIconPath：选中时的图片路径，icon大小限制为40kbBREADPPTDESIGNtabBar•position：可选值bottom（默认）、topBREADPPTDESIGNapp.jsApp()•App()函数用来注册一个小程序。接受一个object参数，其指定小程序的生命周期函数等。•全局的getApp()函数，可以获取到小程序实例•onLaunch：当小程序初始化完成时，会触发onLaunch（全局只触发一次）•onShow：当小程序启动，或从后台进入前台显示，会触发onShowonHide：当小程序从前台进入后台，会触发onHide•onError：当小程序发生脚本错误，或者api调用失败时，会触发onError并带上错误信息•其他：开发者可以添加任意的函数或数据到Object参数中，用this可以访问BREADPPTDESIGNPage•Page()函数用来注册一个页面。接受一个object参数，其指定页面的初始数据、生命周期函数、事件处理函数等。•data：页面的初始数据•onLoad：页面加载•onReady：监听页面初次渲染完成•onShow：监听页面显示•onHide：监听页面隐藏•onUnload：监听页面卸载•onPullDownRefresh：监听用户下拉动作•onReachBottom：页面上拉触底事件的处理函数•onShareAppMessage：用户点击右上角分享BREADPPTDESIGNPagesetData()•setData函数用于将数据从逻辑层发送到视图层，同时改变对应的this.data的值。BREADPPTDESIGNWXML•WXML（WeiXinMarkupLanguage）是框架设计的一套标签语言，用于描述页面的结构。•基本绑定•逻辑判断•for循环BREADPPTDESIGNWXSS•WXSS(WeiXinStyleSheets)是一套样式语言，用于描述WXML的组件样式•尺寸单位：rpx，可以根据屏幕宽度进行自适应。1rpx=0.5px（iphone6）。•@import语句可以导入外联样式表的相对路径，用;表示语句结束。•组件上支持使用style、class属性来控制组件的样式。•选择器•.class•#id•element•element,element•::after：组件后面•::before：组件前面BREADPPTDESIGN组件•一个组件通常包括开始标签和结束标签，属性用来修饰这个组件•所有组件和属性都是小写•基本属性：•id•class•style•hidden•data-*：自定义属性，以data-开头，多个单词由连字符-链接，不能有大写(大写会自动转成小写)如data-element-type，最终在event.target.dataset中会将连字符转成驼峰elementType写法•bind*/catch*：绑定事件BREADPPTDESIGN组件•data-alpha-betaalphaBeta•data-alphaBetaalphabetaBREADPPTDESIGN组件•视图容器•view：基本视图•scroll-view：滚动视图•swiper：滑块视图•表单组件•button•check•form•input•picker•slider•textareaBREADPPTDESIGN组件•导航•navigator•基础内容•icon•text•progress•媒体•audio•image•video•其他（画布、地图、客服）BREADPPTDESIGN组件•scroll-view•scroll-x(y)：横向（纵向）滚动•scroll-top(left)：设置竖向（横向）滚动条位置•scroll-into-view：值应为某子元素id，则滚动到该元素，元素顶部对齐滚动区域顶部•bindscrolltoupper：滚动到顶部/左边，会触发scrolltoupper事件•bindscrolltolower：滚动到底部/右边，会触发scrolltolower事件•bindscroll：滚动时触发BREADPPTDESIGN组件•button属性•size：有效值default,mini•type：按钮的样式类型，有效值primary,default,warn•plain：按钮是否镂空，背景色透明•disabled：是否禁用•loading：名称前是否带loading图标•form-type：有效值：submit,reset，用于form/组件，点击分别会触发submit/reset事件•hover-class：指定按钮按下去的样式类。当hover-class=none时，没有点击态效果BREADPPTDESIGN组件•input•value：输入框的初始内容•type：input的类型，有效值：text,number,idcard,digit•password：是否是密码类型•placeholder：占位符•placeholder-style（placeholder-class）：指定placeholder样式•disabled：是否禁用•maxlength：最大输入长度，设置为-1的时候不限制最大长度•focus：获取焦点BREADPPTDESIGN组件•input•bindinput：当键盘输入时，触发input事件，event.detail={value:value}，处理函数可以直接return一个字符串，将替换输入框的内容•bindfocus：输入框聚焦时触发，event.detail={value:value}•bindblur：输入框失去焦点时触发，event.detail={value:value}•bindconfirm：点击完成按钮时触发，event.detail={value:value}BREADPPTDESIGNAPI•wx.request：发起网络请求•wx.setStorageSync(key，value)：同步存储到本地缓存至key中•wx.getStorageSync(key)：同步获取key对应内容•wx.removeStorageSync(key)：本地缓存中移除key•wx.clearStorageSync()：清理本地缓存数据•wx.getSystemInfoSync()：获取系统信息同步接口•wx.login：登录•wx.getUserInfo：获取用户信息•wx.requestPayment：微信支付•Page.onShareAppMessage：分享•。。。。。。BREADPPTDESIGN完结