1. Create a sub -page during initialization
2. Open the new page directly
3. Pre -load page
【Example】1. Create a sub -page during initialization
mui.init ({{
subpages: [{{
URL: Your -subpage -url, // sub -page HTML address, supports local and network addresses
ID: your -subpage -ID, // subpacked
styles: {{
TOP: subpage -Top -Position, the top position of the sub -page
bottom: subpage -bottom -possition, // the bottom position of the sub -page
width: subpage -width, // sub -page width, the default is 100%
Height: subpage -height, // sub -page height, the default is 100%
... ...
},
Extras: {} // additional extension parameters
}]
});
2. Open the new page directly
mui.openwindow ({{
URL: New -Page -URL,
ID: New -Page -ID,
styles: {{
TOP: Newpage -TOP -POSITION, // New page top position
bottom: newage -bottom -possition, // The bottom of the new page
width: newPage -Width, // New page width, the default is 100%
Height: Newpage -Height, // New page height, default
... ...
},
extras: {
..... // Custom extension parameters can be used to process the value of the page between the page
}
show: {
AutoShow: true, // page loaded event automatically display
Anishow: AnimationType, // Page display animation, the default is slide-in-diamt;
duration: animationTime // page animation duration, the Android platform defaults to 100 millisecond default, the iOS platform defaults to 200 milliseconds;
},
WAITING: {
AutoShow: TRUE, // Automatically display the waiting box, the default is TRUE
title: 'Load ...', // Waiting for the prompt content displayed on the dialog box
options: {
Width: Waiting -Dialog -Widht, // Waiting for the background area of the waiting box, default to automatically calculate the appropriate width according to the content
Height: WAITING -DIALOG -Height, // The background area of the waiting box, the appropriate height is automatically calculated according to the content by default
... ...
}
}
})
3. Pre -load page
// Method 1
mui.init ({{
preloadPages: [{{
url: Prelaood -Page -URL,
ID: Preload -Page -ID,
styles: {}, // window parameters
Extras: {}, // Custom extension parameters
subpages: [{}, {}] // Pre -load page subpage
}]
});
// Method 2
var page = mui.preload ({
URL: New -Page -URL,
ID: New -Page -ID, // URL on the current page as the ID as ID
styles: {}, // window parameters
Extras: {} // Custom extension parameters
});
【Some differences】1. Sub -page and non -sub -page
Among the above three methods, 2,3 open page non -sub -pages,
The difference is that the child page is equivalent to iframe in HTML, not the sub -page is equivalent to a new browser window loaded a HTML
2. Sub -page is suitable for side slide menu
The sub -page has a little bit, especially applicable to the situation with index.html+list.html.
If you use index.html (homepage)+list.html (sub -page), when the right page of the homepage is slipped, the child page will be automatically followed,
If it is implemented with index.html (homepage)+list.html (new page), the homepage surface is right, the new page does not slide right, and the new page must be processed separately.
3. Sub -page practical switching situation
If you frequently slide left and right, list.html will appear on the lower configuration mobile phone to cover the index.html.
The sub -page mode is not available, and the chance of using the new page mode is very high.
4. Sub -page application and drop -down refresh and pull -up load
When I was refreshed before, I used the form of a new page.
According to the official website tutorial, it is unsuccessful to do it,
Later, after looking at the lower source code, I found that the drop -down refresh must adopt the form of the subpage.
That is, your list.html must be the subpage of index.html to drop down.
5. The new page is suitable for the new page
Open is a new page, which is suitable for viewing details. You need to open a new page situation.
And MUI encapsulates the back method of the new page, and you don't need to worry about it.
6. Two ways of pre -loading page
The first is pre -loaded when initialization,
This situation is suitable for your page for a long time.
If you want to get the page immediately, then you will get NULL.
The second way is similar to Open,
I personally feel that there is no big difference,
The only difference is that Open is directly open,
Preload is just loaded, you can choose the timing of opening.
7. Summary
You need to refresh the pull -up load, please use the sub -page, please use the sub -page,
You need to open a new page, please use the new page method,
You need to load a page but not used for the time being, please use the pre -loading method.
The above is all the contents of this article. I hope the content of this article will help everyone's learning or work ~ If you have any questions, you can leave a message to communicate. Thank you for your support for VEVB Wulin.com!