Introduction aux étapes pour créer une mini page de programme dans le mini programme WeChat (images et texte)

Cet article vous présente les étapes de création d'une mini page de programme WeChat. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Créez une page simple et les étapes spécifiques pour créer une mini page de programme :

1. Ajoutez un répertoire dans les pages

Sélectionnez la page, cliquez avec le bouton droit de la souris et sélectionnez parmi Ouvrir le disque dur. Après avoir ouvert le fichier du disque dur, créez un nouveau dossier test (ou cliquez sur le signe + pour ajouter les répertoires un par un et ajoutez les fichiers requis sous les répertoires)

Ou ajoutez-le comme ceci

2. Créez un nouveau fichier wxml

Créez un nouveau. fichier wxml vide sous le dossier test

3. Modifiez le fichier test.wxml

Afin de faciliter les tests, remplissons du contenu

<view class="container">  
    <text>这是我的test页面哦哦！！！</text>  
</view>

4. De la même manière, créez le fichier test.js, modifiez le fichier test.js

Créez un nouveau fichier js vide sous le dossier test
Utilisez la même méthode que ci-dessus. pour créer un fichier test.js dans le répertoire test Pour faciliter les tests, nous pouvons remplir les points avec désinvolture. Entrez le contenu (vous pouvez également le laisser vide ou laisser le fichier vide)

//test.js  
//获取应用实例  
var app = getApp()  
Page({  
  data: {  
    userInfo: {}  
  },  
  onLoad: function () {  
    console.log('onLoad test');  
  }  
})

5. Ajoutez la page de test à app.json

Ouvrez le fichier global app.json et ajoutez " pages/test/test" (ajoutez un répertoire où se trouve la page de test)

6. Ajoutez un lien d'accès au saut sur la page d'accueil

Tout est prêt. Tout ce qui a été ajouté a été ajouté. C'est maintenant le moment d'écrire une entrée de page sur le. page d'accueil, accédez à la page que nous voulons tester et ajoutez un morceau de code et un lien directement vers pages/index/index.wxml sur la page d'accueil

<view class="btn-area">  
   <navigator url="/pages/test/test" hover-class="navigator-hover">跳转test页面</navigator>  
 </view>

7. Test

Enregistrez le code, cliquez sur le bouton compiler ci-dessus, tous les codes s'exécuteront, cliquez sur "Sauter à la page de test" sur la page d'accueil, le saut sera réussi, comme indiqué ci-dessous.

8 : Définir le titre de la page

Définir le titre de la page est une étape très simple Recherchez le répertoire de la page et créez un nouveau fichier json (. généralement Ils sont tous générés automatiquement, sinon créez-en un nouveau), comme la page de test que nous avons construite la dernière fois, recherchez le répertoire pages/test/, créez un nouveau fichier test.json et ajoutez le code suivant.

{
  "navigationBarTitleText": "详情页"
}

L'effet est le suivant :

OK, maintenant, créez des pages et implémentez des sauts entre les pages Compléter

Recommandations associées :

Développement du programme WeChat Mini - Créer une page de bienvenue

Programme WeChat Mini - Création personnalisée

Explication détaillée du cas du mini programme WeChat : construction de la page

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!