1. 程式人生 > >微信小程式傳遞引數(字串、陣列、物件)

微信小程式傳遞引數(字串、陣列、物件)

作者:燕瀟灑

導讀:微信小程式向下個頁面傳遞各種引數,和下個頁面對引數的獲取。

傳遞字串

    //傳遞引數(?model中,model是下個頁面獲取時的key)
   click:function(e){
    var model = this.data.str;
    wx.navigateTo({
      url: '../detail/detail?model=' + model,
    })
  }
  //在下個頁面的onload中獲取,
  onLoad: function (options) {
    var bean = options.model;
    console.log(options.model)
    this
.setData({ model:bean }) },
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

傳遞物件

//通過提供的JSON.stingify方法,將物件轉換成字串後傳遞
  click:function(e){
    var model = JSON.stringify(e.currentTarget.dataset.model);
    wx.navigateTo({
      url: '../detail/detail?model=' + model,
    })
  }
//接收
onLoad: function
(options) {
//將字串轉換成物件 var bean = JSON.parse(options.model); if(options.model == null){ wx.showToast({ title: '資料為空', }) return; } this.setData({ model:bean }) },
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21

傳遞陣列

    方式和傳遞物件相同,注意型別即可!

相關推薦

程式傳遞引數(字串陣列物件)

作者:燕瀟灑 導讀:微信小程式向下個頁面傳遞各種引數,和下個頁面對引數的獲取。 傳遞字串 //傳遞引數(?model中,model是下個頁面獲取時的key) click:function(e){ var model = this.dat

程式傳遞引數方法?

navigator 跳轉url傳參: *.wxml ? 1 2 3 4 <view class="btn-area"> <navigator ur

程式(7)引數傳遞

1、target和currentTarget屬性,基本上沒區別 包含id,dataset(當前元件上由data-開頭的自定義屬性集合),offsetLeft,offsetTop屬性 <view data-org="test" data-level="2" bindtap="bindVi

程式-傳遞多個引數與事件處理

開發過程中經常會遇到從一個頁面攜帶資料到另一個頁面的情況,所以需要知道以下資訊,什麼是事件?有哪些傳遞方式?如果傳遞陣列呢?如果傳遞物件呢? 一、事件 什麼是事件 事件是檢視層到邏輯層的通訊方式 事件可以將使用者的行為反饋到邏輯層進行處理 事件可以繫結在元件上,當

程式url引數傳遞

叨叨兩句 在之前的部落格中glacier簡單的介紹了一下微信小程式,並且寫了個Demo帶大家入了個門; 點選回顧 這次我們學習下微信小程式很重要的一點,URL傳參。 乾貨 app.js App({ onLaunch: function

C#.NET後端,B介面-程式引數二維碼的生成

介面B:適用於需要的碼數量極多,或僅臨時使用的業務場景 介面地址:https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN 注意:通過該介面生成的小程式碼,永久有效,數量暫無限制。使

從零開始學程式開發---2程式專案的建立相關檔案的作用及程式IDE

一、建立一個小程式專案 1、下載安裝微信web開發者工具,目前最新版本是1.02.1811141。 2、開啟,掃碼登入, 3、選擇小程式專案 4、點選專案管理旁邊的+ 5、如果你有小程式賬號會有一個APPID,詳情見小程式簡易教程申請賬號那一節,如果還沒有,可以

從零開始學程式開發---1初識程式

最近在學小程式,記錄並分享一下學習過程,如有謬誤,還請指出! 什麼是小程式? 微信小程式(Mini Program),又稱應用號,它執行在微信客戶端,原始碼打包後不超過1MB(是的,你沒看錯,我也沒寫錯),按照張小龍對小程式的定義,它是一種不需要下載安裝即可使用的應用(其實要經過下載安裝包-

程式】c# 實現獲取openidsession_key 服務端

c#寫一個獲取微信小程式 openid和session_key 的方法。。 1,微信小程式端 // 登入 wx.login({ success: res => { // 傳送 res.code 到後臺換取 openId, sessionKey,

從零開始學程式開發---3程式靜態啟動頁面的製作

現在正式開始編碼啦!~ 我的IDE版本: 首先,新建一個小程式專案,然後建立所需要的檔案以及目錄: 然後在index.wxml中編寫小程式的頁面骨架: <!-- index.wxml是編寫小程式骨架的檔案,相當於HTML --> <!-- <view&g

從零開始學程式開發---4新聞列表頁面的製作(列表渲染)

今天,我們要構建一個如下圖所示的新聞列表頁面(手機截不了長圖,大家將就看吧QAQ): 首先,在pages同級目錄建立一個news目錄,用於放有關新聞列表頁面的各種檔案,然後建立news.wxml,news.wxss,news.js,news.json四個檔案: 然後在app

從零開始學程式開發---5程式頁面跳轉

我們接下來要實現的是:點選“按鈕”,跳轉到另一個頁面 如下圖,當我們點選“開啟小程式之旅”的時候,就會跳轉到news頁面                 首先我們將啟動頁放回pages配置項的第一項

程式+SpringBoot+Mybatis登入demo(一程式端)

現在微信小程式越來越火了,相信不少人都通過各種途徑學習過微信小程式或者嘗試開發,我也是因為新鮮感學習了一下,寫了一個登入demo 前言: 微信小程式開發者註冊API等亂起八糟的東西我這裡就不寫了,是SpringBoot框架不會搭建的可以看我上一篇文章

程式 使用地圖(一) 獲取位置移動選點逆地址解析

wxml: <view class="page-body">   <view class="page-section page-section-gap">     <map id="qqMap" style="width: 100%; heig

B介面-程式引數二維碼的生成

介面B:適用於需要的碼數量極多,或僅臨時使用的業務場景  介面地址:https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=ACCESS_TOKEN 注意:通過該介面生成的小程式碼,永久有效,數量暫無限制。使用者掃描該碼進入小程式

程式入門五: wxml檔案引用模版生命週期

例項內容 wxml檔案引用(include、import) 模版 小程式生命週期 例項一: include方式引用header.wxml檔案 檔案引用對於程式碼的重用非常重要,例如在web開發中我們可以將公用的header部分和foote

程式 Tab實現,可滑動可點選

效果: 直接碼吧,做個筆記。 tab.wxml: <view class="swiper-tab"> <view class="swiper-tab-item {{c

程式開發之左滑修改刪除功能

wxml: <view class="offer-item" wx:for-items='{{offerList}}'> <!--這裡綁定了剛才說的3個函式分別為 touchS,touchM touchE--> &l

程式程式呼叫【統一下單】【支付】【支付回撥】api並處理請求

/* 小程式報名,生成訂單 */ public function make_order(){ if(IS_POST){ $data['openid'] = I('POST.openid'); $data_

程式入門四: 導航欄樣式tabBar導航欄

例項內容 導航欄樣式設定 tabBar導航欄 例項一:導航欄樣式設定 小程式的導航欄樣式在app.json中定義。 這裡設定導航,背景黑色,文字白色,文字內容測試小程式 app.json內容: { "pages":[