Maison interface Web js tutoriel Comment utiliser la méthode Promise object Promise.all() dans Vue (code pur) ?

Comment utiliser la méthode Promise object Promise.all() dans Vue (code pur) ?

Aug 01, 2018 pm 04:49 PM
promise vue.js

Cet article vous présente comment utiliser la méthode Promise.all() de l'objet Promise dans Vue ? Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère que cela vous sera utile.

1. Définir la promesse

<script type="text/javascript">
// 定义一些公共的属性和方法
const httpUrl = 'http://39.105.17.99:8080/'
function promiseFun (url, params) {
  return new Promise((resolve, reject) => {
    this.$http.post(this.globalHttpUrl + url, params).then(
      (res) => {
        resolve(res.json())
      },
      (err) => {
        reject(err.json())
      }
    )
  })
}
var p1 = Promise.resolve(1)
var p2 = Promise.resolve(2)
var p3 = Promise.resolve(3)
Promise.all([promiseFun, p1, p2, p3]).then((res) => {
  console.log(res, 'promise all 方法')
})
// 暴露出这些属性和方法
export default {
  httpUrl,
  promiseFun
}
</script>
Copier après la connexion

2. Utiliser

methods: {
    loginInFun () {
      localStorage.setItem('userId', '00001')
      let params = {
        telphone: this.username,
        password: this.password
      }
      let pro1 = this.promiseFun('itArtison/user/login', params)
      let pro2 = this.promiseFun('itArtisOn/user/register', params1)
      
      // 使用 Promise.all()
      Promise.all([pro1, pro2]).then(
          (res) => {
              console.log(res);
          }
      ).catch(
          (err) => {
              console.log(err)
          }
      )
Copier après la connexion

dans les composants Articles connexes recommandés :

BOM en utilisation Javascript. d'objets

Quelles sont les utilisations de la méthode call() et de la méthode apply() en Javascript (Code ci-joint)

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Will R.E.P.O. Vous avez un jeu croisé?
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Explication graphique détaillée de la façon d'intégrer l'éditeur de code Ace dans un projet Vue Explication graphique détaillée de la façon d'intégrer l'éditeur de code Ace dans un projet Vue Apr 24, 2023 am 10:52 AM

Ace est un éditeur de code intégrable écrit en JavaScript. Il correspond aux fonctionnalités et aux performances des éditeurs natifs comme Sublime, Vim et TextMate. Il peut être facilement intégré à n’importe quelle page Web et application JavaScript. Ace est maintenu en tant qu'éditeur principal de l'IDE Cloud9 et est le successeur du projet Mozilla Skywriter (Bespin).

Découvrez comment écrire des tests unitaires dans Vue3 Découvrez comment écrire des tests unitaires dans Vue3 Apr 25, 2023 pm 07:41 PM

Vue.js est devenu aujourd'hui un framework très populaire dans le développement front-end. À mesure que Vue.js continue d'évoluer, les tests unitaires deviennent de plus en plus importants. Aujourd'hui, nous allons explorer comment écrire des tests unitaires dans Vue.js 3 et fournir quelques bonnes pratiques ainsi que des problèmes et solutions courants.

Une comparaison simple de la syntaxe JSX et de la syntaxe des modèles dans Vue (analyse des avantages et des inconvénients) Une comparaison simple de la syntaxe JSX et de la syntaxe des modèles dans Vue (analyse des avantages et des inconvénients) Mar 23, 2023 pm 07:53 PM

Dans Vue.js, les développeurs peuvent utiliser deux syntaxes différentes pour créer des interfaces utilisateur : la syntaxe JSX et la syntaxe des modèles. Les deux syntaxes ont leurs propres avantages et inconvénients. Discutons de leurs différences, avantages et inconvénients.

Une brève analyse de la façon dont vue implémente le téléchargement par découpage de fichiers Une brève analyse de la façon dont vue implémente le téléchargement par découpage de fichiers Mar 24, 2023 pm 07:40 PM

Dans le processus de développement réel du projet, il est parfois nécessaire de télécharger des fichiers relativement volumineux, puis le téléchargement sera relativement lent, de sorte que l'arrière-plan peut nécessiter que le front-end télécharge des tranches de fichiers. Par exemple, 1 A. Le flux de fichiers de gigaoctets est découpé en plusieurs petits flux de fichiers, puis l'interface est invitée à fournir respectivement les petits flux de fichiers.

Parlons de la façon d'utiliser l'API Gaode Map dans vue3 Parlons de la façon d'utiliser l'API Gaode Map dans vue3 Mar 09, 2023 pm 07:22 PM

Lorsque nous avons utilisé Amap, le responsable nous a recommandé de nombreux cas et démos, mais ces cas utilisaient tous des méthodes natives d'accès et ne fournissaient pas de démos de vue ou de réaction. Cependant, dans cet article, de nombreuses personnes ont écrit sur l'accès à vue2. , nous verrons comment vue3 utilise l'API Amap couramment utilisée. J'espère que cela sera utile à tout le monde !

Exemple détaillé de vue3 réalisant l'effet machine à écrire de chatgpt Exemple détaillé de vue3 réalisant l'effet machine à écrire de chatgpt Apr 18, 2023 pm 03:40 PM

Lorsque je travaillais sur le site miroir chatgpt, j'ai découvert que certains sites miroir n'avaient pas d'effets de curseur de machine à écrire, mais seulement une sortie de texte. Ne voulaient-ils pas le faire ? Je veux le faire de toute façon. Je l'ai donc étudié attentivement et j'ai réalisé l'effet de la machine à écrire et du curseur. Je vais maintenant partager ma solution et mes rendus ~.

Tenir parole : les avantages et les inconvénients de tenir ses promesses Tenir parole : les avantages et les inconvénients de tenir ses promesses Feb 18, 2024 pm 08:06 PM

Dans la vie quotidienne, nous rencontrons souvent des problèmes entre promesses et réalisation. Que ce soit dans une relation personnelle ou dans une transaction commerciale, tenir ses promesses est essentiel pour instaurer la confiance. Cependant, les avantages et les inconvénients de l’engagement sont souvent controversés. Cet article explorera les avantages et les inconvénients des engagements et donnera quelques conseils sur la façon de tenir parole. Les avantages promis sont évidents. Premièrement, l’engagement renforce la confiance. Lorsqu’une personne tient parole, elle fait croire aux autres qu’elle est une personne digne de confiance. La confiance est le lien établi entre les personnes, qui peut les rendre plus

Que dois-je faire si je rencontre une TypeError non capturée (promise) dans une application Vue ? Que dois-je faire si je rencontre une TypeError non capturée (promise) dans une application Vue ? Jun 25, 2023 pm 06:39 PM

Vue est un framework frontal populaire et vous rencontrez souvent diverses erreurs et problèmes lors du développement d'applications. Parmi eux, Uncaught(inpromise)TypeError est un type d’erreur courant. Dans cet article, nous discuterons de ses causes et de ses solutions. Qu'est-ce qu'une erreur de type non interceptée (inpromise) ? L'erreur Uncaught(inpromise)TypeError apparaît généralement dans

See all articles