uni-app的官方api uni.$on

場景： 微信小程序兩個頁面甚至多個頁面之間，可能共用一個參數(shù)或者需要相互傳遞使用參數(shù)。例如頁面A點擊按鈕，需要把A頁面的item數(shù)據(jù)，賦值給頁面B的formData，但是頁面A只是傳遞數(shù)據(jù)給B，卻不跳轉(zhuǎn)到B。導(dǎo)致無法通過頁面路徑跳轉(zhuǎn)傳遞參數(shù)，此時最好的辦法就是使用頁面通訊。

1.A頁面：uni.$emit傳遞數(shù)據(jù)data，

并且會觸發(fā)uni.$on同名事件，進行接收數(shù)據(jù)

methods:{//獲取數(shù)據(jù)getData(){let item={name:'張三',age:18}//傳遞數(shù)據(jù)給 同一個頁面通訊方法uni.$emit('setData',item)} }

2.頁面B：需要事先注冊好同名的uni.$on頁面通訊方法，用來接收數(shù)據(jù)（小程序頁面推薦在onLoad內(nèi)注冊，正常組件只能在mounted內(nèi)注冊），監(jiān)聽全局的自定義事件。

事件可以由 uni.$emit 觸發(fā)，回調(diào)函數(shù)會接收所有傳入事件觸發(fā)函數(shù)的額外參數(shù)。

注意：卸不卸載取決于你自己需求；如果卸載，后期不觸發(fā)onLoad就無法再注冊uni.$on事件，也就無法繼續(xù)監(jiān)聽傳遞接收處理數(shù)據(jù)了

onLoad() {//開啟監(jiān)聽接受傳遞的數(shù)據(jù)uni.$on('setData',(res)=>{console.log('接受的數(shù)據(jù)：',res)this.formData = resthis.name = res.namethis.age = res.age//還可以在這個里面執(zhí)行methods方法this.num()}) },//--------------------------注意：卸不卸載取決于你自己需求；如果卸載，后期不觸發(fā)onLoad就無法再注冊uni.$on事件，也就無法繼續(xù)監(jiān)聽傳遞接收處理數(shù)據(jù)了------------- onUnload() {//卸載關(guān)閉監(jiān)聽設(shè)置數(shù)據(jù)事件uni.$off('setData',()=>{console.log('關(guān)閉監(jiān)聽選擇收貨地址');}) },methods: {num(){console.log(1)}, }

總結(jié)

以上是生活随笔為你收集整理的uni.$emit和uni.$on用法；uni-app微信小程序页面通讯；微信小程序页面通讯的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。