免费国产欧美国日产_少妇AV一区二区三区无码_蜜桃精品av无码喷奶水小说_jk18禁网站视频_精产国品一二三级产品区别_被夫の上司に犯波多野结衣_78m成人手机免费看_最爽最刺激18禁视频_偷偷色噜狠狠狠狠的777米奇

易優(yōu)GEO 重磅上線 ~ 一站式GEO優(yōu)化工具,讓豆包、文心一言、DeepSeek 在回答中主動推薦你的品牌,搶占AI流量入口!  點擊查看

小程序模板網(wǎng)

微信小程序試水教程:參數(shù)傳遞

發(fā)布時間:2018-03-20 10:35 所屬欄目:小程序開發(fā)教程

這里我找到兩種小程序上的參數(shù)傳遞方式,為了方便,我單獨拿出來和大家分享下.

 
 
 
 
 
教程一:參數(shù)傳遞

這里我找到兩種小程序上的參數(shù)傳遞方式,為了方便,我單獨拿出來和大家分享下.

一、通過事件進行參數(shù)傳遞

先來看眼小程序對事件的定義:


#什么是事件?

這里是列表文本事件是視圖層到邏輯層的通訊方式。
這里是列表文本事件可以將用戶的行為反饋到邏輯層進行處理。
這里是列表文本事件可以綁定在組件上,當達到觸發(fā)事件,就會執(zhí)行邏輯層中對應的事件處理函數(shù)。
這里是列表文本 事件對象可以攜帶額外信息,如id, dataset, touches。

很明確的指出了是視圖層【wxml】到邏輯層【js】的通信方式,時間對象可以攜帶額外信息,用這個事件來傳遞參數(shù)肯定沒錯了,接下來我們就來實際看下例子:

視圖.wxml


  <view id="tapTest" data-hi="MINA" bindtap="tapName"> Click me! </view>

邏輯.js


Page({
  tapName: function(event) {
            console.log(event.target)
  }
})

log打印

可以看到 dataset 里面就是我們設置的data-hi="MINA"的值了?,F(xiàn)在我們來看下剛剛我們寫的, 首先 bindtap,以bind開頭的就是要給他綁定個事件,這個事件的名字就是“=”號后面的數(shù)值就是綁定的事件名稱,需要在 邏輯【js】層定義上。 然后就是傳值了,注意到的朋友可以看到 我們這里寫了data-hi 和我們平時寫js的傳值是同一個定義方法。這個data-*就對應事件的屬性target里的dataset 值。這里我們需要調(diào)用的話就是event.target.dataset.hi就能取到data-hi所對應的值。

這里需要注意下 data的定義名稱: 書寫方式: 以data-開頭,多個單詞由連字符-鏈接,不能有大寫(大寫會自動轉(zhuǎn)成小寫)如data-element-type,最終在 event.target.dataset 中會將連字符轉(zhuǎn)成駝峰elementType。

官方示例:


<view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap"> DataSet Test </view>

Page({
  bindViewTap:function(event){
    event.target.dataset.alphaBeta == 1 // - 會轉(zhuǎn)為駝峰寫法
    event.target.dataset.alphabeta == 2 // 大寫會轉(zhuǎn)為小寫
  }
})

二、navigator 跳轉(zhuǎn)url傳參

*.wxml


<view class="btn-area">
  <navigator url="navigate?title=navigate" hover-class="navigator-hover">跳轉(zhuǎn)到新頁面</navigator>
  <navigator url="redirect?title=redirect" redirect hover-class="other-navigator-hover">在當前頁打開</navigator>
</view>

*.js 跳到新頁面之后在onload里面直接接收參數(shù),接收方法也就是 options.[參數(shù)值]


Page({
  onLoad: function(options) {
    this.setData({
      title: options.title
    })
  }
})

好啦,今天就寫到這里,我順便把文檔鏈接寫上,上面寫的文檔里都有。我只是把它們搬出來了,用我的話說了一遍。 …(⊙_⊙;)…



易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://m.szcjxy.com/wxmini/doc/course/22749.html 復制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢: 點擊咨詢
在線客服