NativeBase: Picker Issue on iOS Maximum update depth exceeded
I have gone through these following points
- Check latest documentation: https://docs.nativebase.io/
- Check for existing open/closed issues for a possible duplicate before creating a new issue: https://github.com/GeekyAnts/NativeBase/issues
- Use the latest NativeBase release: https://github.com/GeekyAnts/NativeBase/releases
- Check examples from NativeBase KitchenSink https://github.com/GeekyAnts/NativeBase-KitchenSink
- For discussion purpose make use of NativeBase Slack: http://slack.nativebase.io/
- [] For queries related to theme, check Theme Variables from Docs and live NativeBase Theme Editor http://nativebase.io/customizer/
Issue Description
node, npm, react-native, react and native-base version, expo version if used, xcode version
package.json
# node v10.16.0 npm v6.9.0
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"eject": "expo eject"
},
"dependencies": {
"@expo/vector-icons": "^10.0.3",
"axios": "^0.18.0",
"expo": "^33.0.0",
"expo-constants": "^5.0.1",
"expo-facebook": "~5.0.1",
"expo-font": "~5.0.1",
"expo-image-picker": "~5.0.2",
"expo-location": "~5.0.1",
"expo-permissions": "~5.0.1",
"expo-web-browser": "^5.0.3",
"firebase": "^5.11.0",
"firebase-admin": "^7.0.0",
"moment": "^2.24.0",
"native-base": "^2.13.0",
"prettier": "^1.18.2",
"react": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-axios": "^0.17.1",
"react-native-keyboard-aware-scroll-view": "^0.8.0",
"react-native-modal-overlay": "^1.3.1",
"react-navigation": "^3.3.2",
"react-redux": "^6.0.1",
"redux": "^4.0.1",
"redux-form": "^8.1.0",
"redux-logger": "^3.0.6",
"redux-saga": "^1.0.2",
"redux-saga-firebase": "^0.15.0",
"relative-date": "^1.1.3",
"sentry-expo": "~1.13.0"
},
"devDependencies": {
"babel-preset-expo": "^5.0.0",
"remote-redux-devtools": "^0.5.16"
},
"private": true
}
Expected behaviour
Picker does not throw a Maximum update depth executed error.
Actual behaviour
Picker throws Maximum update depth executed error
Steps to reproduce
Removing this code will not give the error, but I need to use a picker.
<Item picker>
<Picker
mode="dropdown"
iosIcon={<Icon name="arrow-down" />}
style={{ width: undefined }}
placeholder="country"
placeholderStyle={{ color: "#bfc6ea" }}
placeholderIconColor="#007aff"
selectedValue={this.state.country}
onValueChange={this.onCountryChange.bind(this)}
>
<Picker.Item label="Canada" value="Canada" />
<Picker.Item label="United States" value="United States" />
</Picker>
</Item>

Is the bug present in both iOS and Android or in any one of them?
iOS
Any other additional info which would help us debug the issue quicker.
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 3
- Comments: 16 (4 by maintainers)
setState in componentDidUpdate causing issue there should have been a proper code review before merging any PR I am also facing issue on TextInput while onChangeText fix it locally by removing setState in the node modules files but this is not a proper solution I have seen this issue also happening in other controlled components