Register a page in the MiniApp. Accepts an Object type parameter that specifies the initial data of the page, lifecycle callbacks, event handlers, and so on.

Extended functionality: You can create a xxx.ext.json file. The file is merged with the page json file, preferring the configuration in xxx.ext.json (the same is true for components)

1. parameter

Properties	Type	The default value is	Required	Description
data	Object			The initial data for the page
onLoad	function			Lifecycle callback—Listens for page load
onShow	function			Lifecycle callback—The listening page displays
onReady	function			Lifecycle callback—Listens for the completion of the page's first rendering
onHide	function			Lifecycle callback—Listening page hides
onUnload	function			Lifecycle callback—Listens for page unloading
onPullDownRefresh	function			Listen for user pull-down actions
onReachBottom	function			The handler of the pull-bottom event on the page
onTabItemTap	function			When the current tab page is tab, the
onShareAppMessage	function			The user clicks Forward
onPageScroll	function			Handler of page scrolling trigger events
Other	any			Developers can add arbitrary functions or data to the Object parameter, and this can be used in the page's functions to access the

onShareAppMessage

Listen for the user's behavior when they click the "Forward" button in the upper-right corner of the menu and customize the forwarded content.

Parameters

Parameter	Type	Description	Minimum version
title	String		1.0.0
desc	String		1.0.0
imageUrl	String		1.0.0
path	String		1.0.0
from	String	Currently only the 'menu' value	1.0.0
webViewUrl	String	When a page contains a WebView component, the url	of the current WebView is returned 1.0.0

This event handler requires a return Object for custom forwarding content. The returned data is eventually transmitted to the host app.

After the developer returns the above data through the onShareAppMessage, the host app receives the following data format:

2. data

data is the initial data used by the first rendering of the page.

When the page loads, data is passed from the logical layer to the rendering layer as JSON strings, so the data in the data must be of type that can be converted into JSON: strings, numbers, Boolean values, objects, arrays.

The render layer can bind data through WXML.

Sample Code

3. Lifecycle callback functions

onLoad(Object query)

Triggered when the page loads. A page is called only once, and you can get the parameters in the path to open the current page in the parameters of the onLoad.

onShow()

Triggered when the page is displayed/cut to the foreground.

onReady()

Triggered when the first rendering of the page is complete. A page is called only once, indicating that the page is ready to interact with the view layer.

onHide()

Triggered when a page is hidden/switched to the background. Such as navigateTo or the bottom tab to switch to other pages, Mini Apps cut into the background, etc.

onUnload()

Triggered when a page is unloaded. Such as redirectTo or navigateBack when to other pages.

4. Page event handler

onPullDownRefresh()

Listen for user pull-down refresh events.

• EnablePullDownRefresh needs to be enabled in the window option of app.json or in the page configuration.
• Pull-down refresh can be triggered by ft.startPullDownRefresh, and the pull-down refresh animation is triggered after the call, which is consistent with the user's manual pull-down refresh.
• When the data refresh is processed, ft.stopPullDownRefresh can stop the pull-down refresh of the current page.

onReachBottom()

Listen for user pull-up bottom events.

• The trigger distance can be set in the window option of app.json or in the page configuration onReachBottomDistance.
• This event will only be triggered once during swipes within the trigger distance.

onPageScroll(Object object)

Listen for user swipe page events.

Parameter Object object

Properties	Type	Description
scrollTop	Number	The distance (in px) at which the page has scrolled vertically

note

• Please define this method in the page only when you need it, not an empty method. to reduce the impact of unnecessary event dispatch on render-layer-logic layer communication.
• Avoid performing operations such as setData that cause logic-render layer communication in onPageScroll too often. In particular, the transmission of a large amount of data at a time can affect the time it takes to communicate.

5. Component event handlers

Component event handlers can also be defined in Page. Event binding is added to the components of the render layer, and when the event is triggered, the event handler defined in Page is executed.

Sample Code

Page.route

The path to the current page, of type String.

Page.prototype.setData(Object data, Function callback)

The setData function is used to send data from the logical layer to the view layer (asynchronous) while changing the value of the corresponding this.data (synchronous).

Parameter Description

Field	Type	Required	Description
data	Object	Yes	The data to be changed this time
callback	Function	No	The callback function

Object is represented as key: value, changing the value of the key in this.data to value.
where key can be given as a data path, supports changing an item in an array or a property of an object, such as array[2].message, a.b.c.d, and does not need to be pre-defined in this.data.
​

note

1. Directly modifying this.data without calling this.setData cannot change the state of the page, and it will also cause data inconsistencies.
2. Only set JSON-relevant data is supported.
3. The data set up at a time cannot exceed 1024kB, so please try to avoid setting too much data at once.
4. Do not set the value of any item in the data to undefined, otherwise this item will not be set and may leave some potential problems.

Sample Code

PageObject[] getCurrentPages()

Gets the current page stack. The first element in the array is the first page, and the last element is the current page.

note

1. Do not attempt to modify the page stack, which will cause routing and page status errors.
2. Do not call getCurrentPages() at App.onLaunch, when the page has not yet been generated.