react-navigation

问题 How do I hide the shadow under react-navigation headers? They look like this. 回答1: Add the following to the navigationOptions header style. const AppNavigation = StackNavigator( { 'The First Screen!': { screen: FirstScreen }, }, { navigationOptions: { header: { style: { elevation: 0, // remove shadow on Android shadowOpacity: 0, // remove shadow on iOS }, }, }, }, ); The documentation isn't great yet, but you can learn about navigationOptions in the React Navigation Docs. 回答2: The following

问题 i want to render another component in the main component so user won't face a white screen for a second! i'm using TabNavigator from react-navigation and when i want to switch between tabs, i face a white screen for a second (seems it need a second to render). i was thinking of rendering the second tab in the first so i can have a better user experience! P.s. : my components are in separate files! Main: export default class AdCalc extends React.Component { render() { return ( <View> <Text>

问题 I have a screen A , which contains navigable components. One of these components navigates to screen A itself but with different data passed from the triggered component. I am using Redux , and React-navigation. Please help me to know how can I store data of screen according to React Stack Navigation Stage. Stack 4 --> Product Screen[id=103] Stack 3 --> Product Screen[id=102] Stack 2 --> Product Screen[id=101](suppose it contains related products which navigates to Product Screen itself with

问题 I'm using tab navigator and I have a router setting up all off the tabs and I'm using react-native-elements to add a search box into the header of the root tabs: export const Root = StackNavigator({ Tabs: { screen: Tabs, navigationOptions: { header: <SearchHeader /> } }, }, { mode: 'modal', }); I'm trying to change the placeHolder text in the search bar depending on which tab is focused. Any ideas how I might achieve that? I was trying to pass down a state from the router but it wasn't

问题 So I am new to react native and redux . The app is already configured (by someone else) to have react-navigation and redux . Now we're using a TabNavigator (bottom) for our menu and this TabNavigator also contains the Login button. Now what I want to do is when the user logs in, the Login button (with text and icon) becomes Logout. Is there a way to do that? Also my TabNavigator is in a separate file. What I want is something like this: TabNavigator( { ...other screens, //show this only if

问题 I tried react-native on Button which is working fine. I want to customize Button so this made me to go for TouchableOpacity . I am trying to setup react native navigation like below which is not working now. I am using this for navigation https://reactnavigation.org/ index.android.js /** * https://github.com/facebook/react-native * @flow */ import React, { Component } from "react"; import { AppRegistry, Image, View, Text, Button, StyleSheet, TouchableOpacity } from "react-native"; import {

问题 I'm trying to use a function from my Main component in my details component which I user react navigation to navigate to and I want to save some changes in detail screen in my main component //Main.js import React from 'react'; import { StyleSheet , Text, View, TextInput, ScrollView, TouchableOpacity, KeyboardAvoidingView, AsyncStorage } from 'react-native' import Note from './Note' import { createStackNavigator, createAppContainer } from "react-navigation"; import Details from './Details';

问题 I call the react-navigation NavigationService within a redux action. Testing the action I need to mock the navigate function. /app/utils/NavigationService.js import { NavigationActions } from 'react-navigation'; let navigator; function setTopLevelNavigator(navigatorRef) { navigator = navigatorRef; } function navigate(routeName, params) { navigator.dispatch(NavigationActions.navigate({ type: NavigationActions.NAVIGATE, routeName, params, })); } // add other navigation functions that you need

问题 I have created basic ui with react native and Navigation React Navigation V2 My App's entry file(App.js) like this //App.js const App = createSwitchNavigator( { StartupScreen: Validator, //validating accesstoken existing or not if existing navigate to Dashboard otherwise login page Login:Login, DashBoard: Dashboard //tabbed view }, { initialRouteName: 'StartupScreen', } ); export default App how can integrate here with redux? that is how can I pass store to app like <Provider store={store}>

问题 This was working fine within the Login.js component: <View style={{flexDirection: 'row', justifyContent:"center"}}> <TouchableHighlight onPress={() => this.onPressSocialButton('tel')} > <Image source={require('./img/icono-tel.png')} style={{width:70, height:70,margin:10}} /> </TouchableHighlight> <TouchableHighlight onPress={() => this.onPressSocialButton('wa')}> <Image source={require('./img/icono-whatsapp.png')} style={{width:70, height:70,margin:10}} /> </TouchableHighlight>