Shulou(Shulou.com)06/01 Report--

This article will explain in detail the example analysis of WeChat Mini Programs page routing. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

Page routing

In Mini Program, the routing of all pages is managed by the framework.

Page stack

The framework maintains all current pages in the form of a stack. When a routing switch occurs, the page stack behaves as follows:

The performance of the routing page stack initializes the new page into the stack, opens the new page in the stack, redirects the current page out of the stack, the new page enters the stack and returns to the page, until the target returns to the page, and the new page enters the stack Tab switches all out of the stack, leaving only the new Tab page to reload all the pages out of the stack, leaving only the new page getCurrentPages ()

The getCurrentPages () function is used to get an instance of the current page stack, given in the order of the stack in the form of an array, with the first element being the front page and the last element the current page.

Tip: do not try to modify the page stack, which will result in routing and page state errors.

Routing mode

The trigger method of the route and the page lifecycle function are as follows:

Routing method triggers timing before page routing page initializes the first page opened by Mini Program onLoad, onSHow opens a new page to call API wx.navigateTo or use component onHideonLoad, onShow page redirection calls API wx.redirectTo or uses component onUnloadonLoad OnShow page returns call API wx.navigateBack or use component or user press the upper left corner return button onUnloadonShowTab to switch call API wx.switchTab or use component or user to switch Tab. Please refer to the table below to restart calling API wx.reLaunch or use component onUnloadonLoad, onShow

Tab switch the corresponding lifecycle (An and B pages are Tabbar pages, C is a page opened from A page, and D page is a page opened from C page as an example):

Life cycle triggered by the current page after routing (in order) AANothing happendABA.onHide (), B.onLoad (), B.onShow () AB (re-open) A.onHide (), B.onShow () CAC.onUnload (), A.onShow () CBC.onUnload (), B.onLoad (), B.onShow () DBD.onUnload (), C.onUnload (), B.onLoad (), B.onShow () D (enter from forwarding) AD.onUnload (), A.onLoad () A.onShow () D (enter from forwarding) BD.onUnload (), B.onLoad (), B.onShow ()

Tips:

NavigateTo,redirectTo can only open non-tabBar pages.

SwitchTab can only open tabBar pages.

ReLaunch can open any page.

The tabBar at the bottom of the page is determined by the page, that is, as long as the page is defined as tabBar, there is a tabBar at the bottom.

The parameters of the calling page routing belt can be obtained in the onLoad of the target page.

This is the end of the article on "example Analysis of WeChat Mini Programs Page routing". I hope the above content can be helpful to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.