web前端中native有什么作用

本篇內容主要講解“web前端中native有什么作用”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“web前端中native有什么作用”吧!

　　react-native實現頁面之間的相互傳值

　　用到reactNavigation組件

　　兼容性:IOS/Android

　　原理:reactNavigation為頁面的props上掛載了navigation對象,可用來做路由跳轉，在做頁面跳轉時可以攜帶參數/回調方法前往目標頁面，從而達到傳參的目的。

　　切換路由方法：

　　this.props.navigation.goBack()返回上一層

　　this.props.navigation.popToTop()返回堆棧最頂層

　　this.props.navigation.push(‘Details’)繼續往下推送新的路由，相當于子頁面的子頁面

　　this.props.navigation.navigate(‘Details’)將新路由推送到導航器中，如果沒有在導航器中，則跳轉到該頁面

　　父頁面傳參數給子頁面

　　<TouchableOpacityonpress={

　　()=>{

　　this.props.navigation.navigate('B',{

　　params:xx,

　　})

　　}

　　}>

　　子頁面接收參數

　　constructor(props){

　　super(props);

　　const{navigation}=this.props;

　　letyy=navigation.getParam("params");

　　}

　　這樣子頁面就獲取到父頁面傳遞過來的值了。

　　ReactNative添加Redux支持

　　現在項目環境如下：

　　{

　　"name":"app",

　　"version":"0.0.1",

　　"private":true,

　　"scripts":{

　　"start":"react-nativestart",

　　"test":"jest",

　　"lint":"eslint."

　　},

　　"dependencies":{

　　"native-base":"^2.13.4",

　　"react":"16.8.6",

　　"react-native":"0.60.5",

　　"react-native-gesture-handler":"^1.3.0",

　　"react-native-keyboard-aware-scroll-view":"^0.9.1",

　　"react-native-reanimated":"^1.2.0",

　　"react-navigation":"^3.11.1"

　　},

到此，相信大家對“web前端中native有什么作用”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！