検索
ホームページWeChat アプレットミニプログラム開発WeChatアプレットのページジャンプとパラメータ転送の詳細説明

この記事では、主にWeChatミニプログラムのページジャンプとパラメータ転送の詳細な説明に関する関連情報を紹介し、簡単な例と実装レンダリングを添付していますので、必要な友人は参考にしてください

WeChatミニプログラムのページジャンプとパラメータ転送、WeChatの作成。ミニプログラム このプログラムは間違いなくそのような関数を使用します。 ここでは、コードを実装するために学んだ情報を記録します。

私は WeChat ミニ プログラムを初めて使用するため、その構文や属性についてあまり知りません。あまり多くの箇所がない場合は、アドバイスをいただければ幸いです。今日は、WeChat アプレットでパラメータをジャンプして転送する方法について説明します。早速、コードに進みましょう。

実装された関数は、次のページにパラメーターを渡すためにリストにクリック関数を追加することです。

微信小程序 页面跳转传参详解

コードは次のとおりです。 is="buttonList" data= "{{item}}"/>

テンプレートコードは以下の通りです

<import></import> 
<view> 
  <!--滚动图--> 
  <view> 
   <swiper> 
    <block> 
      <swiper-item> 
         <image></image> 
      </swiper-item> 
    </block> 
  </swiper> 
  </view> 
  <!--功能按钮--> 
  <view> 
    <block> 
     <!--模版--> 
      <template></template> 
      <!--<view class="section-item"> 
     <image class="section-img" src="{{item.image}}"></image> 
      <text class="section-text">{{item.text}}</text>  
    </view>--> 
    </block> 
  </view> 
  <!--资讯列表--> 
  <view> 
    <block> 
      <template></template> 
    </block> 
     
  </view> 
 
 
 </view>


以下のリストはクリックメソッドのみ追加しています


クリックリストjs code

<template> 
   <view> 
     <image></image> 
      <text>{{item.text}}</text>  
    </view> 
</template> 
 
<!--list--> 
<template> 
   <view> 
    <view> 
      <image></image> 
    </view> 
 
     <view> 
       <view><text>{{item.title}}</text></view> 
       <view><text>{{item.subTitle}}</text></view> 
    </view> 
  </view> 
   
</template>


このうち、


wx.navigateTo({url:'/pages/xiangqing/xiangqing?id=前ページのパラメータ'})

がジャンプメソッド、idパラメータが動的パラメータの場合、コードは次のとおりです:


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


ここで、p は各行に設定された ID 値です


次のページは次のとおりです:

<pre class="brush:php;toolbar:false"> listClick:function(event){ 
   console.log(event); 
   var p = event.currentTarget.id 
   
   wx.navigateTo({url:'/pages/xiangqing/xiangqing?id='+p}) 
  }


その後、ページに表示されるコードは次のとおりです:


<view>{{title }}</view> <p></p>最終的な効果: <p></p><p><br></p><p> 読んでいただきありがとうございます。このサイトをサポートしていただきありがとうございます。 <br></p>その他の WeChat ミニ プログラム、ページ ジャンプ、パラメーター受け渡しの詳細な説明については、PHP 中国語 Web サイトの関連記事に注目してください。 <p><br></p><p></p>
声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強力な PHP 統合開発環境

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

WebStorm Mac版

WebStorm Mac版

便利なJavaScript開発ツール

VSCode Windows 64 ビットのダウンロード

VSCode Windows 64 ビットのダウンロード

Microsoft によって発売された無料で強力な IDE エディター