Data analysis is no lack of public documents from the micro-letter applet.
Registration procedures App () function
App(Object object)
Registration applet. Accepts a Object
parameter, which specifies the lifecycle callbacks and other small programs.
App()
Must app.js
call, you must call and be called only once. Otherwise, there will be unintended consequences.
Developers can getApp
get to a globally unique way App
of example, to obtain App
data or calling on developers registered in the App
function on.
Basic framework as follows:
// app.js
App({
onLaunch (options) {
// Do something initial when launch.
},
onShow (options) {
// Do something when show.
},
onHide () {
// Do something when hide.
},
onError (msg) {
console.log(msg)
},
test:function() { //添加
console.log("my name is test and come from App.js");
},
globalData: { //添加
userInfo:null,
helloFromApp:'Hello,I come from App.js' //---添加
}
})
Which
onLaunch
lifecycle callbacks - the listener small program initialization. When the applet initialization is complete, it will trigger onLaunch (Global triggers only once).
onshow
Lifecycle function - monitor applet displays. When the applet is started, or from the background into the foreground display is triggered onShow
.
onHide
Lifecycle function - monitor applets hidden. When the applet from the foreground into the background, it will trigger onHide
onError
an error monitor function. When a small script error occurs or api call fails, it will trigger onError and bring the error message.
onPageNotFound
Page listener function does not exist. When the situation appeared to be a small program to open a page that does not exist, the page will bring information to the callback function.
Foreground, background is defined : When the user clicks to close the upper left corner, or press the Home key to leave the micro-channel device, the applet is not directly destroyed, but into the background; micro letter when entering or re-open the applet again, will enter the foreground from background . Note that: Only small program into the background when a certain time or system resources is too high, will be the real destruction.
note:
- Do not defined in the App (function) in the call getApp (), you can use this app to get the instance.
- Do not call getCurrentPage when onLaunch of (), then page has not been generated.
- By getApp (after acquiring instance, Do not attempt to call the life-cycle function).
Page(Object object)
A small program registration page. Take an Object type parameter, which specifies the initial data page, lifecycle callbacks, event handlers and so on.
data
The initial data page.
When the page is loaded, data will be transmitted in the form of a string JSON render layer by the logic layer, the data in the data must be converted to JSON types: string, number, Boolean, object array.
onLoad
Lifecycle callbacks - monitor page load
onShow
lifecycle callbacks - page display monitor
onReady
lifecycle callbacks - listening initial page rendering is complete
onHide
lifecycle callbacks - monitor page Hide
setData
Function is used to transmit data from the logical layer to the view layer (asynchronous), while varying the value corresponding this.data (synchronization).
Note: directly modify this.data without calling this.setData can not change the state of the page, it will result in data inconsistencies.
Object
In key: value
the form represented, to this.data
the key
change to the value corresponding to value
.
Examples
//index.js
Page({
data: {
text: 'init data',
num: 0,
array: [{ text: 'init data' },{text:'ascboa'}],
object: {
text: 'init data'
}
},
changeText: function () {
// this.data.text = 'changed data' // bad, it can not work
this.setData({
text: 'changed data'
})
},
changeNum: function () {
this.data.num = 1
this.setData({
num: this.data.num
})
},
changeItemInArray: function () {
// you can use this way to modify a danamic data path
this.setData({
'array[1].text': 'changed data'
})
},
changeItemInObject: function () {
this.setData({
'object.text': 'changed data'
});
},
addNewField: function () {
this.setData({
'newField.text': 'new data'
})
}
})
<!--index.wxml-->
<view>{{text}}</view>
<button bindtap="changeText"> Change normal data </button>
<view>{{num}}</view>
<button bindtap="changeNum"> Change normal num </button>
<view>{{array[1].text}}</view>
<button bindtap="changeItemInArray"> Change Array data </button>
<view>{{object.text}}</view>
<button bindtap="changeItemInObject"> Change Object data </button>
<view>{{newField.text}}</view>
<button bindtap="addNewField"> Add new data </button>
require
We can get other files to export data via require (), but it should be noted that the path can only be passed to require a relative path. Such as:
var util = require("../../utils/util.js");
Also here is equivalent to adding a custom library functions, call the members of the util.
form
Form
report-submit
whether a message template for sending a return formId ..
report-submit-timeout
Wait for some time (milliseconds) to confirm formId take effect. If this parameter is not specified, formId there is a small probability is invalid (the situation in case of network failure). This parameter can specify whether or not effectively detect formId to this time as the timeout parameter of this detection. If it fails, it returns requestFormId: formId fail beginning of
bindsubmit
carrying data in form submit event, event.detail = {value: { ' name': 'value'}, formId: ''}
bindreset
trigger reset event when the form is reset .
The main frame as follows
<form bindsubmit="formSubmit" bindreset="formReset">
<button formType="submit">Submit</button>
<button formType="reset">Reset</button>
</form>
Basic code attribute analysis app.json
app.json
File for the global data file.
page
Attribute
each page
must be registered here. In other words, wondering what micro-channel small program page
, look here on it. If you want to create a new page
, similar here was added on it.
windows
Properties
avigationBarBackgroundColor
: Navigation bar background color.
navigationBarTitleText
: Text navigation bar.
navigationBarTextStyle
: Navigation bar text color