Les données dans Vue sont obtenues via Ajax, puis Vue est instanciée.
Comment contr?ler que la requête Ajax soit exécutée d'abord après le chargement de la page, puis instancier Vue une fois la requête réussie ?
L'événement onload est lié à la requête Ajax et Vue est instanciée lors du rappel réussi.
J'ai vu une question similaire sur Baidu hier.
Je voudrais demander d'où elle vient??
Vous voulez savoir pourquoi vous faites cela ?
Ma réponse est : ce n’est pas recommandé.
Vous pouvez demander en création,
Il est préférable de ne pas laisser la page attendre les demandes, sinon elle sera vide,
Lors de la création, si vous n'arrivez toujours pas à obtenir le résultat après montage, vous pouvez demander une animation de chargement
Ne laissez pas la page attendre la demande avant le rendu. Si la vitesse Internet de l'utilisateur n'est pas bonne et que l'animation de chargement n'est pas vue mais qu'elle est vide, la première chose à laquelle vous penserez est le problème avec le site Web. il y a une animation de chargement, vous saurez qu'elle attend la demande
Utilisez l'animation de chargement pour faciliter la compréhension des utilisateurs
$.ajax({
url: "...",
...
success: function(){
active();
}
});
function active(){
let app=new Vue({
data:{
},
...
})
}
Attendez simplement que la requête aboutisse, puis exécutez la fonction et instanciez vue?!
En fait, il s’agit d’une exigence très courante.
Vue peut être instanciée du premier coup, à ce moment data
可以沒有值,界面上展示loading或"正在加載"之類的提示,同時(shí)在實(shí)例的created
鉤子中發(fā)起數(shù)據(jù)請(qǐng)求,得到數(shù)據(jù)后給實(shí)例賦值就行了,vm.data = ajaxData
.
$(document).ready(function() {
$.ajax({
type: "get",
async: false,
url: '',
dataType: "JSONP",
beforeSend: function(){
$("#content .loading").html("數(shù)據(jù)加載中<img class='loading-gif' src='images/loading.gif'/>");
},
success: function (data) {
if(data.orders.length != 0){
$("#content .loading").empty();
// 實(shí)例化
}
else{
$("#content .loading").html("暫時(shí)沒有你的數(shù)據(jù)哦");
}
},
error: function (message) {
$("#content .loading").html("數(shù)據(jù)請(qǐng)求失敗,請(qǐng)稍候再試");
}
});
});
$(document).ready() signifie exécuter la fonction à l'intérieur après le chargement de la page.
écrivez quelques invites de chargement dans le beforeSend de jquery ajax. Si le succès efface les invites, alors s'il y a des données, elles seront instanciées. S'il n'y a pas de données, il vous demandera également si ce n'est pas le cas. erreurs. C'est celui que je viens d'écrire lors de mon récent stage. Je le trouve personnellement assez complet.
Ce n'est pas un problème technique, c'est un problème de conception de produit. Vous devriez peut-être demander à votre produit pourquoi il a un tel design.