中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

如何在微信小程序的頁面間傳遞數(shù)據(jù)?

2021-01-30    分類: 微信小程序

在微信小程序的開發(fā)中,我們會經(jīng)常遇到頁面間數(shù)據(jù)傳遞或者相互影響的問題。在實際的開發(fā)過程中,可以通過以下幾種方法來實現(xiàn)。

使用全局變量

全局變量實際上是定義了一個全局的對象,并在每個頁面中引入。

在初始化代碼的時候,小程序會讀取一個 app.js 的文件,在這里我們可以定義我們所需要的全局變量。

//app.js ... App({ globalData : { foo : 'bar' }

});

然后在頁面中,可以通過 getApp() 方法獲取到全局應(yīng)用對象,可以對全局變量進(jìn)行讀取并更改:

//page.js ... var app = getApp() var getFoo = app.globalData.foo app.globalData.foo = 'fun'

由于 app.js 在項目中是用來做基礎(chǔ)配置的,因此不建議將很多變量放在這里配置。一般情況下會將一些持久化的常量配置在這里,對于經(jīng)常需要變動的量不建議用這個方法。

使用本地緩存

本地緩存是微信小程序提供的一個功能,可以將用戶產(chǎn)生的數(shù)據(jù)做本地的持久化,類似于 NoSQL,可以進(jìn)行讀取和修改的操作。

那么在不同的頁面之間,如何利用它,進(jìn)行數(shù)據(jù)的交互呢?

假設(shè)我們在 A 頁面保存了用戶的信息。

// pageA.js ... var developer = {

  name: 'raymond',

  gender: 'male' }


wx.setStorageSync('developer', developer);

這樣做,這個數(shù)據(jù)就存在了本地。當(dāng)在 B 頁面需要使用的時候,可以直接的獲取到數(shù)據(jù)池中的數(shù)據(jù),并進(jìn)行 CRUD 操作:

//pageB.js ... // Retrieve var developer = (wx.getStorageSync('developer') || []) // Update developer.name = 'Jiayang' wx.setStorageSync('developer', developer); // Delete wx.removeStorage({

  key: 'developer' })

需要注意的是,在回到 A 頁面的時候,小程序需要重新讀取數(shù)據(jù)。這時候,可以選擇放在生命周期的父級往子級頁面(模板)的數(shù)據(jù)傳遞

我們通常會在頁面之間進(jìn)行跳轉(zhuǎn)、重定向的操作。這時候,我們可以選擇將部分?jǐn)?shù)據(jù)放在pageC.js ... // Navigate wx.navigateTo({ url: '../pageD/pageD?name=raymond&gender=male',

}) // Redirect wx.redirectTo({ url: '../pageD/pageD?name=raymond&gender=male',

})

在 D 頁面中,我們可以這樣接收到到所傳進(jìn)來的參數(shù):

// pageD.js ...

Page({

  onLoad: function(option){

    console.log(option.name + 'is' + option.gender)

    this.setData({ option: option })

  }

})

wx.navigateTo 微信新提供的 wx.reLaunch 接口可以傳入?yún)?shù)。

另外,在頁面中我們通常會用到一些組件模板,因此在父子之間也會有相應(yīng)的數(shù)據(jù)傳遞。

使用 name 屬性,作為模板的名字。然后在這里面使用 is 屬性,聲明需要的使用的模板。

{{index}}: {{msg}} Time: {{time}}

然后將模板所需要的<template is="msgItem" data="{{...item}}"/>

Page({ data: { item: { index: 0, msg: 'this is a template', time: '2016-09-15' }

  }

})

傳入模板的除了變量,還可以是事件方法對象。例如,模板中的點擊事件,可以傳遞到使用模板的元素中。

通過獲取到頁面對象進(jìn)行數(shù)據(jù)操作

這個方法的精髓,是通過獲取到其他頁面的對象原型,然后通過原型方法//pageE.js ... Page({ data: { index: 1 }

})

當(dāng)跳轉(zhuǎn)到下一個頁面 F 之后,假定在 F 中有操作需要對 E 中的數(shù)據(jù)有修改,則可以使用以下方法:

pageF.js

...

Page({

  changeIndexInE: function(){ var pages = getCurrentPages(); var prevPage = pages[pages.length - 2];

    prevPage.setData({

      index: 0 })

  }

})

這個方法可以操作頁面堆棧里面的頁面的數(shù)據(jù),可以做到讓后一級頁面對上級頁面群的數(shù)據(jù)管理。

小結(jié)

在微信小程序中有以上并且不局限于以上幾種的方式進(jìn)行頁面間數(shù)據(jù)傳遞、交互,在實際應(yīng)用中可以組合使用。比如說:

●一些常量,可以交由●涉及到下級頁面或者模板元素的數(shù)據(jù),可以通過傳入?yún)?shù)的方式傳入。

●后級頁面可以通過獲取堆棧里的頁面對象快速修改上級的數(shù)據(jù)。

在實際應(yīng)用中結(jié)合使用,可以更好地管理小程序的數(shù)據(jù)。

本文如有不周到之處,可以留言進(jìn)行討論。

當(dāng)前標(biāo)題:如何在微信小程序的頁面間傳遞數(shù)據(jù)?
URL鏈接:http://www.rwnh.cn/news33/98283.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項目有微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站制作
云林县| 华安县| 依安县| 泽州县| 舟山市| 修文县| 中方县| 乐都县| 淮北市| 新晃| 内黄县| 景德镇市| 沙田区| 石嘴山市| 遂溪县| 石首市| 新平| 达日县| 雷州市| 临湘市| 社会| 竹溪县| 高台县| 曲周县| 西丰县| 乡城县| 松江区| 梧州市| 井冈山市| 建瓯市| 揭东县| 汝城县| 达孜县| 岑溪市| 兴文县| 二连浩特市| 泸溪县| 禹州市| 克拉玛依市| 高清| 东城区|