Comment charger des pages Web externes ou des données de serveur à l'aide du framework MUI

Je vais maintenant partager avec vous une brève discussion sur la méthode de chargement de pages Web externes ou de données de serveur dans le framework MUI. Elle a une bonne valeur de référence et j'espère qu'elle sera utile à tout le monde.

Lorsque beaucoup de nos étudiants implémentent le framework MUI, ils utilisent souvent la méthode mui.openwindow lors de l'ouverture d'une nouvelle page. Cependant, lorsqu'ils rencontrent des pages Web, elles doivent être téléchargées depuis le serveur ou imbriquées en externe. lors du chargement d'une page Web, en raison de problèmes de vitesse du réseau, un écran blanc peut apparaître pendant le chargement et le temps d'attente est trop long, ce qui entraîne une mauvaise expérience utilisateur

Utilisez plus.webview. lorsque la page est chargée. La méthode create résout très bien ce problème

Sans plus tarder, collez simplement le code

Nous avons d'abord besoin. pour créer une page parent , voici le JS de la page parent

// H5 plus事件处理 
function plusReady(){ 
var nwaiting = plus.nativeUI.showWaiting();//打开原生加载等待框 
ws=plus.webview.currentWebview();//创建一个新的页面 
embed=plus.webview.create(“createShow.html”,”“,{bottom:”0px”});//新的页面地址 
embed.onclose=embedClose; 
ws.append(embed);
} 
if(window.plus){ 
plusReady(); 
}else{ 
document.addEventListener(“plusready”,plusReady,false); 
} 
// 页面关闭事件回调函数 
function embedClose(e){ 
alert( “Closed!” ); 
}

Créer une sous-page createShow.html, c'est le nom que je me suis donné,

mui.init({
      //示例打开百度,进行加载
      subpages:[{
        url:"https://www.baidu.com",
        id:"https://www.baidu.com",
        styles:{
        }
      }]
    })

mui.plusReady(function(){
var ws = plus.webview.currentWebview();//加载进外部网页,加载完成关闭等待框
ws.show('slide-in-right', 50);
plus.nativeUI.closeWaiting();
} )

Ce qui précède est ce que j'ai compilé pour tout le monde. Oui, j'espère que cela sera utile à tout le monde à l'avenir.

Articles associés :

Utilisation du plug-in de chargement différé d'image dans vue-lazyload

Comment utiliser highCharts pour dessiner une 3D diagramme circulaire dans Vue

Comment utiliser ueditor dans vue

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!