react-navigation在Redux下多頁(yè)面跳轉(zhuǎn)

react-navigation目前是RN必備的導(dǎo)航,正常的單級(jí)跳轉(zhuǎn) 返回 傳值 只要按官方的方法即可,或者參考兔神的文章。但是項(xiàng)目中往往需要用到多級(jí)跳轉(zhuǎn),這個(gè)時(shí)候就需要花點(diǎn)功夫了。

在正常情況下要多級(jí)跳需要改源代碼,相當(dāng)不方便,這里是基于redux環(huán)境的跳轉(zhuǎn)。

首先,在要跳轉(zhuǎn)的頁(yè)面導(dǎo)入:

import { NavigationActions } from 'react-navigation'

然后,在跳轉(zhuǎn)的方法里面:

等需要操作的方法執(zhí)行完之后:
const resetAction = NavigationActions.reset({
                                index: 0,
                                actions: [
                                    NavigationActions.navigate({ routeName: 'Main'})
                                ]
                            })
                            this.props.navigation.dispatch(resetAction)

我這邊demo是執(zhí)行退出方法,將路由重置,這樣用戶(hù)登錄后下次進(jìn)來(lái)就是首頁(yè)了。
index是指tabbar的第一個(gè)選項(xiàng),routeName就是定義的頁(yè)面名字,可以根據(jù)自身的需求進(jìn)行頁(yè)面跳轉(zhuǎn)。

所以,大概方法就是如此拉。

--------------- 補(bǔ)充 ---------------
在導(dǎo)航v2.0以上的版本,方法有所變化
import { StackActions,NavigationActions } from 'react-navigation';
const resetAction = StackActions.reset()

reset的執(zhí)行文件改了下

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容