頁面url帶參數_微信小程序云開發教程微信小程序的JS高級頁面間數據傳遞

? 同學們大家好,我是小伊同學,上一節課我們講解了全局數據的讀寫方法,那么在頁面間同樣需要數據交互,今天我們就來學習這部分內容。

? 在微信小程序中,我們常常需要將數據在頁面之間進行傳遞,比如用戶的身份信息,在不同頁面的接口中都需要這個參數,服務端通過這個參數來判斷是哪個用戶請求了服務。因此,數據在頁面之間的傳遞在小程序開發中也是必不可少的。

56cd3de83669287cacde03a576339d82.png

? 頁面間數據傳遞主要有兩種方式,第一種,通過頁面跳轉過程中攜帶參數,另一種方式是將數據保存在全局數據中,每個頁面再從全局數據中讀取。在本小程序中,我們主要使用了第二種,因此我們將講解第二種方式,對于第一種同學們可以通過微信開發者文檔進行學習。

d0c18e2864581f48e6dea7c420640b1f.png

? 具體來說,我們可以通過URL傳遞參數。在原頁面中,js文件中調用API進行跳轉時在URL路徑結尾后帶參數。參數與路徑之間使用 ? 分隔,參數鍵與參數值用?=?相連,不同參數用?&?分隔;如 "path?key=value&key2=value2"?。

? 在打開的新頁面中,js文件中onLoad函數接收參數中含有傳遞過來的數據。例如這里的示例,我們已經學過redirectTo是頁面跳轉的api,當我們執行后,在新頁面就可以收到id變量,由于字符串可以拼接,我們可以在左邊寫成id=然后引號結束加號加上變量值。

67822cc361a4299a4afd0f3a9e17f54c.png

? 其次,可以通過頁面間事件通信通道(EventChannel)傳遞參數

在原頁面中,js文件中調用API進行跳轉時在success回調函數中向被打開頁面傳送數據。在打開的新頁面中,js文件中onLoad函數持續監聽事件獲取頁面傳遞參數。同樣是傳遞id參數,我們分別拷貝使用這兩段代碼打開事件通信通道即可。

a4ba61eaf64e7b9833bc68299e7247a7.png

? 下面我們來比較一下這幾種方式。URL傳遞參數,只能從在A頁面打開B頁面時,從A頁面向B頁面傳遞參數。事件通信通道(EventChannel)傳遞參數,在A頁面打開B頁面時,可以從A頁面向B頁面傳遞參數,也可以同時從B頁面向A頁面傳遞參數(我們剛才只介紹了前者,后者給大家作為作業自學)。

? 這兩種方式通常用于傳遞簡單數據,如標志信息、id信息和字符串等,使用時需要依賴路由API。而全局數據交互:不介意頁面的打開順序,通常用于傳遞重要共享數據,該數據往往在多個頁面都需要而不僅僅限于兩個頁面之間,使用時需要使用getApp()。

? 日拱一卒,功不唐捐。涓流所積,終成滄海。

想看視頻版?

關注公號“微程序學堂”,我們的視頻教程即將上線

如果你自己寫了好文章想投稿

請聯系我們

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/538099.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/538099.shtml
英文地址,請注明出處:http://en.pswp.cn/news/538099.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

軟件測試員對英語,軟件測試工程師英語面試題

以下是軟件測試工程師部分英語面試中的參考回答,僅提參考:Interview English:一,Why are you interested in working for our company?1。Because your company has a good sales record.2。Because your operations are global,…

OpenGL——二維幾何變換

平移、旋轉、縮放的實現 #include<iostream> #include <math.h> #include<Windows.h> #include <GL/glut.h>using namespace std;GLsizei winWidth 600, winHeight 600;GLfloat xwcMin 0.0, xwcMax 225.0; GLfloat ywcMin 0.0, ywcMax 225.0;cla…

在Eclipse 中打開當前文件夾

原文連接&#xff1a;https://www.cnblogs.com/panie2015/p/5985053.html ------------------------------------------------------------------------ 最近試過好多次&#xff0c;安裝插件來 在Eclipse 中打開當前文件所在文件夾&#xff0c;結果總是不甚如意。 煩躁了&…

清華大學計算機系主任應明生,清華大學計算機科學與技術系導師簡介:應明生...

對考生而言&#xff0c;充分了解高校、專業以及師資情況是一項最基礎、最關鍵的工作。以下是中公考研小編為大家整理的“清華大學計算機科學與技術系導師簡介&#xff1a;應明生”的相關信息&#xff0c;希望對同學們有所幫助。姓名&#xff1a;應明生職稱&#xff1a;教授郵件…

在VS2013平臺下如何快速解決c++代碼內存泄漏問題

在學習FPS3000人臉關鍵點定位算法時&#xff0c;發現github上的源碼&#xff0c;存在大量的內存泄漏問題&#xff0c;在訓練的時發現內存一直在增長&#xff0c;測試的時候也存在內存無法徹底釋放的問題。 一直以為是存放模型參數vector<class>結構的問題&#xff0c; 采…

python請簡述構造函數和析構函數的作用_python – 構造函數和析構函數如何工作?...

我正在嘗試理解這段代碼&#xff1a;class Person:Represents a person population 0def __init__(self,name)://some statements and population 1def __del__(self)://some statements and population - 1def sayHi(self):grettings from personprint Hi My name is %s % s…

服務器應用日志清理,Linux下Tomcat日志定期清理

服務器上的tomcat的catalina.out文件越來越大&#xff0c;查看起來很不方便&#xff0c;以前每次都是想起來的時候手工清理一下(cat /dev/null > catalina.out)&#xff0c;后來發現了logratate這個工具&#xff0c;Ubuntu下的mysql,nginx好像也是用的這個工具還定期整理log…

dubbo簡易監控中心安裝

dubbo簡易監控中心也是dubbo服務應用。 為什么叫“簡易”&#xff1f;這是阿里巴巴定義的&#xff0c;意思是功能不多但夠用&#xff0c;可以自己擴展。 1、下載dubbo源碼&#xff0c;要與使用的dubbo版本一致。 https://github.com/alibaba/dubbo/releases 2、maven instal…

前端架構設計1:代碼核心

現在的前端領域, 隨著JS框架, UI框架和各種庫的豐富, 前端架構也變得十分的重要. 如果一個大型項目沒有合理的前端架構設計, 那么前端代碼可能因為不同的開發人員隨意的引入各種庫和UI框架, 導致代碼量變得異常臃腫, 最終結果可能是代碼變得無法維護, 頁面性能低下,不得已只能推…

如何用法向量求點到平面距離_支持向量機(SVM)

最近完成的一個項目用到了SVM&#xff0c;之前也一直有聽說支持向量機&#xff0c;知道它是機器學習中一種非常厲害的算法。利用將近一個星期的時間學習了一下支持向量機&#xff0c;把原理推了一遍&#xff0c;感覺支持向量機確實挺厲害的&#xff0c;尤其是核函數變換可以把一…

TortoiseSVN 1.9.5安裝 與 Eclipse4.4.2中安裝SVN插件 圖解詳解

原文鏈接&#xff1a;http://blog.csdn.net/chenchunlin526/article/details/54631458 Eclipse svn 插件官網&#xff1a;http://subclipse.tigris.org/ Eclipse svn 插件更新網站&#xff1a;https://github.com/subclipse/subclipse/wiki -------------------------------…

虛擬服務器關機返回用戶信息,在Linux服務器關機前向用戶顯示一條自定義消息...

在先前的文┞仿中&#xff0c;我們說清楚明了 Linux 中 shutdown、poweroff、halt、reboot 敕令的不合之處&#xff0c;并揭示了在用不合的選項履行這些敕令時它們實際做了什么。# shutdown 13:25本篇將會向你展示如安在體系關機時向所有的體系用戶發送一條自定義的消息。建議瀏…

eclipse svn不能忽略文件及文件夾,ignore設置無效 ?

SVN這塊做得不好&#xff0c;如果之前提交過此文件&#xff0c;就不能設置忽略該文件了。所以第一次提交的時候要搞清楚再提交。 【 親測&#xff0c;的確如此&#xff0c;用 Windows -> Preferences -> Team -> Ignored Resources 方法不行。 項目右鍵--team--設置…

華為服務器產品系列號查詢,華為LIST全系列 服務器產品速查清單

該樓層疑似違規已被系統折疊 隱藏此樓查看此樓型號 描述S5700-EI-AC-B09 S5700-52C-EI交換機(48個10/100/1000Base-T RJ45,2個10GE SFP上行口, 含堆疊卡)S5700-EI-AC-B06 S5700-28C-EI交換機(24個10/100/1000Base-T RJ45,2個10GE SFP上行口, 含堆疊卡)FC0M00S67403 S6748-EI交換…

BZOJ4300 絕世好題

目錄 BZOJ4300 絕世好題題解&#xff43;&#xff4f;&#xff44;&#xff45;BZOJ4300 絕世好題 題目傳送門 題解 比較簡單的\(DP\)&#xff0c;記\(f[i]\)表示第\(i\)位為&#xff11;&#xff0c;最長的長度為多少。只需要枚舉每一個數字&#xff0c;對于這個數字二進制下…

Sonatype Nexus 庫被刪除的恢復方法

原文連接&#xff1a;https://my.oschina.net/u/178116/blog/519840 --------------------有道云筆記保存---------------------------------------------- 今天在整理公司Maven私服的時候&#xff0c;不小心把Release庫刪掉了。瞬間冒出冷汗來了&#xff01;公司所有的積累都…

hbase 修改表名_hbase修改表名 - 張歡19933的個人空間 - OSCHINA - 中文開源技術交流社區...

hbase修改表名hbase修改表名沒有直接的api可以調用&#xff0c;我們如果想要修改表名&#xff0c;可以利用快照的方式。需要開啟快照功能&#xff0c;在hbase-site.xml文件中添加如下配置項&#xff1a;hbase.snapshot.enabledtrue命令hbase shell> disable tableNamehbase …

ajax一次輸出1萬條數據庫,后端接口一次給出100萬條數據,請問你前端怎么分頁處理...

面試官既然能這么問&#xff0c;我們從技術的角度出發&#xff0c;探索一下這道題&#xff0c;上手操作了一下&#xff1a;function loadAll(response) {var html "";for (var i 0; i < 100000; i) {html "title:" 我正在測試[i] "";}$(…

“” '' ``區別 初學者自用

單引號 相當于吧里面的內容直接輸出。并不會考慮里面是否有變量命令等雙引號 "" 只認變量 命令會直接輸出反引號 兩種都認 實例&#xff1a; a"hello" [localhost.localdomain 10:16:09]$echo echo %a輸出&#xff1a;echo %a [localhost.localdomain…

maven私有庫配置

不同的項目&#xff0c;不同的私有庫1、添加倉庫Release 發布&#xff1b; 發行倉庫snapshot 快照&#xff0c;開發&#xff0c;調試倉庫配置完成2、配置權限默認開通的權限&#xff0c;查看權限給剛才建的兩個私有庫添加權限配置好后3、創建角色&#xff0c;分配權限添加rolei…