react navigation 中使用goBack()跳轉到指定頁面

一、適用場景:

在app端開發的時候,相反回到某一個頁面的時候保持跳轉頁面的所有狀態不更新,也就是說不觸發新的生命週期、

例如:A——>B——>C——>D

要想從D頁面直接返回到B頁面又保持B頁面的所有狀態,不去觸發B頁面的生命週期,

有人說可以用:this.props.navigation.navigate,是可以實現跳轉,但是這樣會觸發B頁面的新的生命週期

所有用this.props.navigation.goBack('接受參數');

二、但是需要注意的是 接收的參數問題

1.官網goBack()用法react navigation官網

2.goBack的參數爲頁面路由的key, 這個key是系統隨機分配的,每一次加載的時候分配的都是不一樣的; 而不是手動設置的routeName, 所以參數填routeName無法跳轉, goBack如果不帶參數(即key爲undefined)會默認返回上一個頁面

goBack(key)這個key是指:

從路由值爲key這個路由頁面返回,

而不是返回到值爲key的頁面

也就是說從D返回到B,這裏的key值並不是B頁面的路由key值,而是,C的key值,因爲B是由C返回的,所以此處的key值應該爲C頁面的key值

所以要想從D返回到B頁面應該是

this.props.navigation.goBack("C頁面的key")

because react-navigation only provide method goBack(key), it's go back from key, not go back to key.

參考:https://stackoverflow.com/questions/45489343/react-navigation-back-and-goback-not-working

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章