mui幾種頁面跳轉方式對比

2021-07-15 00:02:59 字數 2162 閱讀 3727

【幾種開啟頁面的方式】

1.初始化時建立子頁面

2.直接開啟新頁面

3.預載入頁面

【示例】

1.初始化時建立子頁面

[js]view plain

copy

mui.init(,  

extras: {} //額外擴充套件引數

}]  

});  

[js]view plain

copy

mui.init(,  

extras: {} //額外擴充套件引數

}]  

});  

2.直接開啟新頁面

[js]view plain

copy

mui.openwindow(,  

extras:   

show: ,  

waiting:   

}  })  

[js]view plain

copy

mui.openwindow(,  

extras:   

show: ,  

waiting:   

}  })  

3.預載入頁面

[js]view plain

copy

// 方式1

mui.init(, //視窗引數

extras: {}, //自定義擴充套件引數

subpages: [{}, {}] //預載入頁面的子頁面

}]  

});  

// 方式2

varpage = mui.preload(, //視窗引數

extras: {} //自定義擴充套件引數

});  

[js]view plain

copy

// 方式1

mui.init(, //視窗引數

extras: {}, //自定義擴充套件引數

subpages: [{}, {}] //預載入頁面的子頁面

}]  

});  

// 方式2

varpage = mui.preload(, //視窗引數

extras: {} //自定義擴充套件引數

});  

【一些區別】

1.子頁面和非子頁面

以上三種方式中,2,3開啟的頁面非子頁面,

區別是子頁面相當於html中的iframe,而非子頁面相當於新開了乙個瀏覽器視窗載入了乙個html

2.子頁面適用於側滑選單

子頁面有其有點,特別適用與index.html+list.html這種情況,

如果用index.html(主頁面)+list.html(子頁面)實現的話,當主頁面右滑時子頁面會自動跟隨,

而用index.html(主頁面)+list.html(新頁面)實現的話,主頁面右滑,新頁面不右滑,還得單獨處理新頁面。

3.子頁面實用頻繁切換的情況

如果頻繁左滑右滑,在配置較低的手機上會出現list.html遮住index.html的情況,

採用子頁面模式就不會,採用新頁面模式機率很大。

4.子頁面適用與下拉重新整理和上拉載入

之前做大下拉重新整理的時候,採用的是新頁面的形式,

按照官網教程,怎麼搞都不成功,

後來看了下原始碼,發現下拉重新整理必須採用子頁面的形式,

也就是你的list.html必須是index.html的子頁面,才可以下拉重新整理。

5.新頁面適用於新頁面

並且mui自己封裝了新頁面的back方法,你就不需要去操心了。

6.預載入頁面的兩種方式

第一種是在初始化的時候預載入,

這種情況適合在你這個頁面在很久之後才會用,

如果你要立即到的頁面並使用,那麼你會得到null。

第二種方式類似與open,

個人感覺沒有什麼太大的區別,

唯一的區別是open就直接開啟了,

preload只是載入,你可以之後選擇開啟的時機。

7.總結

需要下拉重新整理上拉載入請使用子頁面,

需要開啟乙個新頁面請使用新頁面方式,

需要載入乙個頁面但是暫時不使用請使用預載入方式。

mui幾種頁面跳轉方式對比

1.初始化時建立子頁面 mui.init extras 額外擴充套件引數 2.直接開啟新頁面 mui.openwindow extras show waiting 3.預載入頁面 方式1 mui.init 視窗引數 extras 自定義擴充套件引數 subpages 預載入頁面的子頁面 方式2 va...

MUI 幾種頁面開啟方式

1.初始化時建立子頁面 2.直接開啟新頁面 3.預載入頁面 1 2 3 4 5 6 7 8 9 10 11 12 13 14 mui.init extras 額外擴充套件引數 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24...

springMVC 幾種頁面跳轉方式

前面已經了解了controller的幾種配置方式 今天主要寫一下響應介面跳轉的幾種方式 1.在註解的方式中 1.1通過httpservletresponse的api直接輸出 不需要配置渲染器 controller類的主要 1 controller 2public class requestcontr...