root-two / react-native-drawer

React Native Drawer
MIT License
2.54k stars 390 forks source link

Drawer Automatically Closes when editing TextInput via onChangeText #320

Open awreese opened 7 years ago

awreese commented 7 years ago

I have a TextInput element within my drawer and anytime I start editing with calls to onChangeText it closes the drawer. When I re-open the drawer the modified text is there, but the drawer closes as soon as I'm editing again. The on-screen keyboard stays open and the TextInput remains focused and editable, even while the drawer is closed. No combination of pan masks and/or gestureCapturing settings I could come up with would keep the drawer open while editing.

A workaround I've found is using the onSubmitEditing and capturing the event.nativeEvent.text field to capture what was typed in (and not saving the intermediate text value to state during editing).

If needed, I can provide my drawer code snippet.

[edit] So it seems the drawer closes whenever a callback sets some new state.

awreese commented 7 years ago

Hmmm, not really sure what changed, but now that behavior I was observing is no longer happening. I'm able to have a regular TextInput box, edit the text while saving intermediate input state, and the drawer stays open until user either clicks/taps/swipes to close. Closing.

awreese commented 7 years ago

Reopening. So after working on the iOS side of my app I came back to do some android testing and this behavior is happening again. It still appears to happen when editing within the TextInput element during my onChangeText callback where I setState with the value from the input box. When setState is not called the drawer remains open.

munkhorgil commented 6 years ago

@awreese I just encountered with this issue. Still no solution yet?

awreese commented 6 years ago

@munkhorgil Nope, only my workaround from my original post. Seems setting state bubbles up an event that closes the drawer, but I haven't the time to dig/trace through the drawer codebase to see where that event is captured by the drawer.