418
react native插件 react-navigation使用心得
StackNavigator
StackNavigator(screens,configs)
const Stack = StackNavigator({
Home: {
screen: Home,
},
Profile: {
screen: Profile
}
},{
mode: 'card', // 頁麵切換模式, 左右是card(相當於iOS中的push效果), 上下是modal(相當於iOS中的modal效果)
headerMode: 'screen', // 導航欄的顯示模式, screen: 有漸變透明效果, float: 無透明效果, none: 隱藏導航欄
onTransitionStart: ()=>{ console.log('導航欄切換開始'); }, // 回調
onTransitionEnd: ()=>{ console.log('導航欄切換結束'); } // 回調
});
screen頁麵
export default class Home extends React.Component {
//本頁麵的屬性配置
static navigationOptions = {
title: 'Home',
}
render() {
return (
<View>
<Text>Home</Text>
</View>
)
}
}
最後更新：2017-08-29 17:33:02