Maison >interface Web >uni-app >Parlons de quelques méthodes pour fermer la page uniapp

Parlons de quelques méthodes pour fermer la page uniapp

PHPz
PHPzoriginal
2023-04-20 13:51:082021parcourir

Dans le développement récent d'applications mobiles, uniapp est devenu un framework de développement de plus en plus populaire. Il est basé sur le framework Vue, qui permet aux développeurs de développer facilement et rapidement des applications natives basées sur plusieurs plateformes (telles qu'Android et iOS). Dans l'application uniapp, il peut être difficile de fermer certaines pages. Par conséquent, cet article présentera quelques méthodes pour fermer la page uniapp afin d'aider les développeurs à mieux comprendre les fonctions de l'application.

Méthode 1 : saut de page via VueRouter

Dans uniapp, VueRouter peut fournir un router.go(n) pour accéder aux n premiers itinéraires de l'itinéraire actuel, c'est-à-dire que n=1 est l'itinéraire actuel, n=2 pour l'itinéraire précédent, et ainsi de suite. uniapp a apporté quelques améliorations à cette méthode de saut et utilise uni.navigateBack() dans l'APP pour effectuer des opérations de restauration de page. De cette manière, aucun itinéraire ne sera recyclé dans l'application générale monopage (SPA), et seule l'APP native peut avoir pour effet de fermer la page.

// 利用uni.navigateBack(-1)来实现页面回退操作,其中-1表示回退到前一个页面。
uni.navigateBack(-1);

Méthode 2 : utilisez l'événement personnalisé d'uniapp pour fermer la page

Uniapp fournit également une méthode d'événement personnalisée, qui peut écouter un événement dans le composant et effectuer l'opération correspondante. Grâce à cette méthode, la page peut également être réalisée. de fermeture :

//子组件使用自定义事件来关闭页面,父组件直接调用$emit触发事件
//子组件代码
methods:{
  //点击调用子组件的关闭方法
  close(){
    this.$emit('close');
  }
}
//父组件代码
<template>
  <view>
      <child @close="close"/>
  </view>
</template>
<script>
export default {
  methods: {
    close() {
     uni.navigateBack(-1);
    }
  }
};
</script>

Méthode 3 : utilisez la fonctionnalité mixins de Vue pour fermer la page

Il existe une fonctionnalité dans Vue appelée Mixins qui peut mélanger un objet dans une instance d'un composant Vue pour réaliser la fonction de réutilisation d'objets. Les mixins peuvent être définis globalement ou individuellement dans les composants. Ici, nous définissons l'opération de fermeture de page globalement.

//在全局中编写一个mixin对象,调用close方法可以关闭当前页面
Vue.mixin({
  methods:{
    close(){
      uni.navigateBack(-1);
    }
  }
});

Voici les trois méthodes ci-dessus pour fermer la page dans uniapp. Les développeurs peuvent choisir une méthode qui leur convient en fonction de leurs besoins réels. J'espère que cet article pourra vous être utile.

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:
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