我們?cè)谧鲰?yè)面的時(shí)候,經(jīng)常會(huì)有組件之間傳值的情況,uniapp的組件傳值方法和vue類似,無(wú)非兩種URL傳值和事件傳值。
第一種辦法,通過(guò)url傳值,我們?cè)谑褂胣avigateTo進(jìn)行頁(yè)面跳轉(zhuǎn)的時(shí)候,在頁(yè)面的url路徑后面加上所需要傳遞的數(shù)據(jù)。然后在onload中通過(guò)返回值就能拿到上一個(gè)頁(yè)面?zhèn)鬟f過(guò)來(lái)的數(shù)據(jù)。這種方法適用于簡(jiǎn)單數(shù)據(jù)的傳遞,比如字符串,數(shù)字,布爾值。
但是,我們也有可能需要傳遞一整個(gè)對(duì)象,比如想要優(yōu)化接口,避免非必要的請(qǐng)求。這個(gè)時(shí)候我們可以使用getOpenerEventChannel進(jìn)行傳值,這個(gè)能夠傳遞復(fù)雜數(shù)據(jù),比如數(shù)組,對(duì)象。我們?cè)谔D(zhuǎn)的時(shí)候額外加上success,固定格式為res.evventchannel.emit,后邊跟著的是我們自定義的需要傳遞的事件名。然后再跟上我們要傳遞的數(shù)據(jù)。
在接受頁(yè)面我們這樣寫,固定格式的
const eventChannel = this.getOpenerEventChannel()
第一種方法就算沒(méi)有上層也可以通過(guò)設(shè)置固定的url來(lái)進(jìn)入到該頁(yè)面 并實(shí)現(xiàn)數(shù)據(jù)的請(qǐng)求,但是第二種方法如果父頁(yè)面沒(méi)有的話,便不會(huì)得到任何數(shù)據(jù)。我們傳遞簡(jiǎn)單數(shù)據(jù)一般使用url傳遞,復(fù)雜數(shù)據(jù)使用getOpenerEventChannel傳值,第一種不論是發(fā)送還是獲取都比第二種簡(jiǎn)單。
了解更多uniapp知識(shí)點(diǎn)擊這里。