Comment accéder à une page externe dans Uniapp

Avec la popularité des applications mobiles, nous devons de plus en plus accéder à des pages externes de l'application. Cette fonctionnalité existe également dans uniapp. Cet article explique comment accéder à des pages externes dans uniapp.

1. API pour accéder à des pages externes dans uniapp

Dans uniapp, utilisez la fonction uni.navigateTo() pour ouvrir une nouvelle page. Il peut accéder à une page dans Uniapp ou à une page externe. Il accepte un paramètre : URL.

URL est une chaîne commençant par http, https, ftp, tel, sms, mailto et d'autres protocoles. Si l'URL commence par http ou https, le navigateur sera ouvert directement et redirigé vers cette adresse.

2. Implémenter le saut vers une page externe

Dans le développement réel, nous devons implémenter une fonction qui accède à une page externe après avoir cliqué sur un bouton.

Tout d'abord, créez une nouvelle page sous le dossier de pages du projet uniapp, par exemple, appelée page externe. Ajoutez le code suivant au fichier vue de la page externe :

<template>
  <div class="container">
    <h1>这里是外部页面</h1>
  </div>
</template>

<script>
export default {
  name: 'OuterPage',
  mounted () {
    setTimeout(() => {
      this.jump()
    }, 2000)
  },
  methods: {
    jump () {
      uni.navigateTo({
        url: 'https://www.baidu.com'
      })
    }
  }
}
</script>

Ici, nous définissons un délai de 2 secondes dans le hook monté sur la page, puis appelons une méthode jump(). Dans la méthode jump(), utilisez la fonction uni.navigateTo() pour accéder à l'URL externe https://www.baidu.com. De cette façon, il suffit de cliquer sur le bouton de saut pour voir la page externe s'ouvrir.

Ensuite, ajoutez un bouton à la page d'entrée du projet uniapp pour accéder à la page externe. Dans le fichier vue de la page d'entrée, ajoutez le code suivant :

<template>
  <div class="container">
    <h1>这里是uniapp项目入口页</h1>
    <button @click="jump">跳转到外部页面</button>
  </div>
</template>

<script>
export default {
  name: 'Index',
  methods: {
    jump () {
      uni.navigateTo({
        url: '/pages/outerPage/outerPage'
      })
    }
  }
}
</script>

Ici, nous ajoutons un bouton à la page. Lorsque l'utilisateur clique sur le bouton, la méthode jump() est appelée et la fonction uni.navigateTo() est utilisée. pour accéder à la page externe.

3. Résumé

Il est très simple d'accéder à une page externe dans uniapp. Utilisez simplement la fonction uni.navigateTo() et transmettez l'adresse URL de la page externe pour réaliser le saut. Mais il convient de noter que si vous devez accéder à d’autres pages du mini-programme, vous devez utiliser la fonction uni.navigateToMiniProgram(). Grâce à l’introduction de cet article, nous pensons que vous maîtrisez déjà bien la méthode de passage aux pages externes.

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!