Explication détaillée du saut de page de l'applet WeChat et du passage des paramètres

Cet article présente principalement les informations pertinentes sur l'explication détaillée du saut de page du mini programme WeChat, et joint des exemples simples et des rendus de mise en œuvre. Les amis dans le besoin peuvent se référer à

Le saut de page du mini programme WeChat Les paramètres de transmission sont. une fonction qui doit être utilisée lors de la création de mini-programmes WeChat. Ici, j'enregistrerai les informations que j'ai apprises pour implémenter le code.

Je suis nouveau dans les mini-programmes WeChat et je ne connais pas grand-chose à leur syntaxe et à leurs attributs. S'il n'y a pas beaucoup d'endroits, j'espère que vous pourrez me donner quelques conseils. Aujourd'hui, parlons de la façon de sauter et de transférer des paramètres dans l'applet WeChat. Sans plus tarder, passons directement au code. La fonction implémentée par

est d'ajouter une fonction de clic à la liste pour passer des paramètres à la page suivante ; où

4d49e5dbce84bf7a2869c84b59c185f6

Le code du modèle est le suivant

<import src="../WXtemplate/headerTemplate.wxml"/> 
<view> 
 <!--滚动图--> 
 <view> 
 <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoPlay}}" interval="{{intervalTime}}" duration="{{Time}}"> 
 <block wx:for="{{imageURl}}"> 
  <swiper-item> 
   <image src="{{item}}" class="imagePX"></image> 
  </swiper-item> 
 </block> 
 </swiper> 
 </view> 
 <!--功能按钮--> 
 <view class="section-bg"> 
 <block wx:for="{{buttonNum}}"> 
  <!--模版--> 
  <template is="buttonList" data="{{item}}"/> 
  <!--<view class="section-item"> 
  <image class="section-img" src="{{item.image}}"></image> 
  <text class="section-text">{{item.text}}</text> 
 </view>--> 
 </block> 
 </view> 
 <!--资讯列表--> 
 <view> 
 <block wx:for="{{listNum}}"> 
  <template is="newList" data="{{item,index}}"/> 
 </block> 
  
 </view> 
 
 
 </view>

Ici, nous ajoutons uniquement une méthode de clic pour la liste ci-dessous

Cliquez sur le code js de la liste

Parmi eux

<template name="buttonList"> 
 <view class="section-item"> 
  <image class="section-img" src="{{item.image}}" bindtap="buttonClick"></image> 
  <text class="section-text">{{item.text}}</text> 
 </view> 
</template> 
 
<!--list--> 
<template name="newList"> 
 <view class="section-list" bindtap="listClick" id="{{index}}"> 
 <view> 
  <image class="list-img" src="{{item.image}}"></image> 
 </view> 
 
  <view class="section-textt"> 
  <view class="title"><text>{{item.title}}</text></view> 
  <view class="subTitle"><text>{{item.subTitle}}</text></view> 
 </view> 
 </view> 
 
</template>

wx.navigateTo({url :'/pages/xiangqing/xiangqing?id=paramètre de la page précédente '})

est la méthode de saut, et id est le paramètre qui doit être passé. Si le paramètre est un paramètre dynamique, le code est le suivant :

listClick:function(event){ 
 console.log(event); 
 var p = event.currentTarget.id 
 
 wx.navigateTo({url:'/pages/xiangqing/xiangqing?id=上一页的参数'}) 
 }

où p est la valeur d'identifiant définie ci-dessus pour chaque ligne

Le code de valeur sur la page suivante est le suivant :

Affichez ensuite le code sur la page comme suit :

listClick:function(event){ 
 console.log(event); 
 var p = event.currentTarget.id 
 
 wx.navigateTo({url:'/pages/xiangqing/xiangqing?id='+p}) 
 }

89c662c6f8b87e82add978948dc499d2{{title}}< ;/view>

Effet final :

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!