react-navigation

Difference between “lazyLoad” and “lazy” in react-navigation options

喜欢而已 提交于 2019-12-13 03:34:29
问题 I had a problem re-rendering my component on tabs change, and apparently adding lazyLoad: true to the navigation options solved it. But I don't understand very well how it works...especially before that, I had another problem and adding lazy: true to options solved it. so my question is, what is the difference between the two and how they work in react-navigation :) 回答1: There are two major releases of react navigation , react-navigation-v1 and react-navigation-v2 When react-navigation loads

How to create dynamic routes using StackNavigator

[亡魂溺海] 提交于 2019-12-13 03:32:22
问题 I am trying to learn how to use React Navigation on react-native and stumbled upon this article: https://hackernoon.com/getting-started-with-react-navigation-the-navigation-solution-for-react-native-ea3f4bd786a4. It explains how to create a 3 level navigation with fixed routes. My question is how do you go about creating a 3 or more levels of navigation when some of the routes should be dynamic. The screen structure would look something like this: Physics |- Physics 101 |- Chapter 1 |-

Border bottom on Bottom Navigation in React Native

此生再无相见时 提交于 2019-12-13 03:30:58
问题 I am new to React Native. I am making a bottom navigation bar. I want to add border bottom when the tab is selected, like the picture below. According to the docs, the indicatorStyle is only applicable on Top Navigation. I am unsure on how to do it. import { createBottomTabNavigator, } from 'react-navigation'; import SettingsScreen from '../settings'; import rootStyles from '../../rootStyles'; const ICON_HOME = require('../../../assets/icon/home.png'); const ICON_USER = require('../../..

React native, React Navigation integration issue undefined is not an object getStateForAction

♀尐吖头ヾ 提交于 2019-12-13 03:11:03
问题 So I've been follow this tutorial and adapting for what I need. I've checked the other answer but can't quite make out what I'm missing? For the search engines, the error is: undefined is not an object, router, getStateForAction App.js import React, {Component} from 'react'; import {createStore, combineReducers, applyMiddleware} from 'redux' import {Provider, connect} from 'react-redux' import reducers from './reducers' import {View} from 'react-native' import ReduxNavigation from '.

getting error gradlew.bat installDebug after installing react navigation and gesture handler

会有一股神秘感。 提交于 2019-12-12 13:10:17
问题 I create the new react native app using command react-native init appName. After the app created successfully install it in my device using command react-native run-android, it installed successfully, and works fine... no issue but as soon I install react navigation and gesture handler I am getting the error that Command failed: gradlew.bat installDebug after running command react-native run-android I don't know what's wrong... my old react native projects are working perfectly fine. I

react-navigation and component lifecycle

眉间皱痕 提交于 2019-12-12 11:24:51
问题 I have a React Native application that uses react-navigation. In one of my screen, I'm using camera to read the QR code what works fine but I have to use setState({camera: false}) to prevent loading of QR code multiple times. Usually, it works. Even after re-entering page from main menu. Trouble is when user press '<' button (iOS / in the header) and he should re-enter page with camera. I'm not able to find a function where I should do setState({camera: true}). Without react-navigation, there

Which lifecycle event is called when a screen appears?

跟風遠走 提交于 2019-12-12 10:57:10
问题 Suppose I have two screens: Screen A Screen B I am initially landed on Screen A . When I click on a Button I navigate to Screen B . When I press Back Button , I am again navigated to Screen A . I want to call an action creator when I am navigated to Screen A as mentioned in above scenario. I just want to know that which lifecycle event will be called every time when a screen is presented. Isn't there some event like componentWillAppear() ? Note: I am using react-native with react-navigation

React Navigation Stack Navigator default shadow styling

六月ゝ 毕业季﹏ 提交于 2019-12-12 10:53:32
问题 I'm using React Navigation to construct a tab bar based type of an app in ReactNative. "react-native": "0.44.0", "react-navigation": "^1.0.0-beta.9", I've got the navigation part pinned down and working. But with regards to styling I'm seeing a shadow on the StackNavigator (navigation controller) inside tab bar. Refer image below. I'm not used to seeing this kind of a shadow on native iOS apps (I'm an iOS mobile dev trying out RN) upon further investigation I saw that there are 'shadow'

Modifying back button with react-navigation on specific screen

和自甴很熟 提交于 2019-12-12 10:50:03
问题 I'm using react-navigation as my navigation lib, and I wonder how can I change the 'back' button (that is added automatically by react-navigation ) functionality for a specific screen? I mean instead of going one step in the stack of screens I want it to go 2 steps back in stack. or do it manually by giving it a screen name (again only on one component). thanks. 回答1: You can override back button for a specific screen with navigationOptions of that screen. You can read more info about

Remove top navigation bar for certain screens

时间秒杀一切 提交于 2019-12-12 08:25:50
问题 Is there a way of removing the top navigation bar for specific screens only? I am using react-navigation. I already tried the following: header: { visible: false } but it only hides the navbar. The space of the navbar is still cannot be used. Thanks in advance! 回答1: This is an example of how I did mine using StackNavigator: const stackN = StackNavigator({ Screen1 : { screen: Screen1, navigationOptions: { header: null, } }, Home : { screen: HomeScreen, navigationOptions: ({navigation}) => ({