我們在做頁面的時候,經常會有組件之間傳值的情況,uniapp的組件傳值方法和vue類似,無非兩種URL傳值和事件傳值。
第一種辦法,通過url傳值,我們在使用navigateTo進行頁面跳轉的時候,在頁面的url路徑后面加上所需要傳遞的數據。然后在onload中通過返回值就能拿到上一個頁面?zhèn)鬟f過來的數據。這種方法適用于簡單數據的傳遞,比如字符串,數字,布爾值。
但是,我們也有可能需要傳遞一整個對象,比如想要優(yōu)化接口,避免非必要的請求。這個時候我們可以使用getOpenerEventChannel進行傳值,這個能夠傳遞復雜數據,比如數組,對象。我們在跳轉的時候額外加上success,固定格式為res.evventchannel.emit,后邊跟著的是我們自定義的需要傳遞的事件名。然后再跟上我們要傳遞的數據。
在接受頁面我們這樣寫,固定格式的
const eventChannel = this.getOpenerEventChannel()
eventChannel.on('事件名', (data) => {}),其中的data就是我們傳遞過來的值。
第一種方法就算沒有上層也可以通過設置固定的url來進入到該頁面 并實現數據的請求,但是第二種方法如果父頁面沒有的話,便不會得到任何數據。我們傳遞簡單數據一般使用url傳遞,復雜數據使用getOpenerEventChannel傳值,第一種不論是發(fā)送還是獲取都比第二種簡單。
了解更多uniapp知識點擊這里。
上一篇: uniapp使用阿里巴巴矢量圖標庫
下一篇: js中如何使用php的數據