English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

WeChat Mini-Programm: detaillierte Erklärung der Weiterleitung von Seiten mit Parameter

 Seitenumschaltung und Übergabe von Parametern in微信小程序, diese Funktion wird sicherlich oft verwendet, wenn man微信小程序 macht. Hier wird die von mir gelernte Code-Dokumentation notiert.

Für diejenigen, die gerade erst mit微信小程序开始接触,kann es sein, dass manche Syntax und Attribute noch nicht so gut kennt. Falls es einige Unklarheiten gibt, hoffe ich, dass alle großartigen Meister viele Anleitungen geben können. Heute werde ich über das Springen und Übergeben von Parametern in微信小程序 sprechen, ohne lange um den heißen Brei zu reden, hier ist der Code direkt.

Die implementierte Funktion ist es, der Liste eine Klickfunktion hinzuzufügen und Parameter an die nächste Seite zu übergeben;

   

Code folgt:

<import src="../WXtemplate/headerTemplate.wxml"/> 
<view> 
 <!--Rollbild--> 
 <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> 
 <!--Funktionsschaltflächen--> 
 <view class="section-bg"> 
 <block wx:for="{{buttonNum}}"> 
  <!--Muster--> 
  <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> 
 <!--Informationenliste--> 
 <view> 
 <block wx:for="{{listNum}}"> 
  <template is="newList" data="{{item,index}}"/> 
 </block> 
 </view> 
 </view> 

Dabei

<template is="buttonList" data="{{item}}"/> 

Für das Mustercode folgt:

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

Hier wurde nur der Klick-Methoden für die Liste unten hinzugefügt

Klick-Code der Liste

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

Dabei

wx.navigateTo({url:'/pages/xiangqing/xiangqing?id=Parameter der vorherigen Seite'}) 

Für die Weiterleitungs-Methode, id ist der zu übergebende Parameter, wenn der Parameter dynamisch ist, lautet der Code wie folgt: 

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

Dabei ist p der für jede Zeile festgelegte id-Wert

Der Code zum Werteholen auf der nächsten Seite ist wie folgt: 

 data:{ 
 // text:"Dies ist eine Seite" 
 title:'' 
 }, 
 onLoad:function(options){ 
 // Seiteninitialisierung options sind die Parameter der Seitenverbindung 
 this.setData({ 
 title:options.id 
 ) 

Dann wird der Code auf der Seite wie folgt angezeigt:

<view>{{title}}</view> 

Endeffekt:

Vielen Dank für das Lesen, ich hoffe, es kann Ihnen helfen, danke für Ihre Unterstützung dieser Seite!

Empfohlen für Sie