By TurboFish


2015-04-16 20:33:33 8 Comments

If I tap onto a textinput, I want to be able to tap somewhere else in order to dismiss the keyboard again (not the return key though). I haven't found the slightest piece of information concerning this in all the tutorials and blog posts that I read.

This basic example is still not working for me with react-native 0.4.2 in the Simulator. Couldn't try it on my iPhone yet.

<View style={styles.container}>
  <Text style={styles.welcome}>
    Welcome to React Native!
  </Text>
  <Text style={styles.instructions}>
    To get started, edit index.ios.js
  </Text>
  <Text style={styles.instructions}>
    Press Cmd+R to reload,{'\n'}
    Cmd+D or shake for dev menu
  </Text>
  <TextInput
    style={{height: 40, borderColor: 'gray', borderWidth: 1}}
    onEndEditing={this.clearFocus}
  />
</View>

28 comments

@TripleM 2020-07-06 10:46:58

The simple way to do this =>

import {keyboard} from 'react-native'

and then use the function keyboard.dismiss()

That's all.

Here is a screenshot of my code so you can understand faster. Import Keyboard from react native. Also import TouchableWithoutFeedback

Now wrap the entire view with TouchableWithoutFeedback and onPress function is keyboard.dismiss()

Here is the example TouchableWithoutFeedback and keyboard.dismiss()

In this way if user tap on anywhere of the screen excluding textInput field, keyboard will be dismissed.

@Cyrus Zei 2020-02-06 14:12:06

use this package react-native-keyboard-aware-scroll-view

use that component as your root component

since this package react-native-keyboard-aware-scroll-view also have an scrollView you need to add this to it:

<KeyboardAwareScrollView keyboardShouldPersistTaps="handled"> <ScrollView keyboardShouldPersistTaps="handled"></ScrollView> </KeyboardAwareScrollView>

@Arthur Mastropietro 2019-11-19 22:28:57

Wrap your whole component with:

import { TouchableWithoutFeedback, Keyboard } from 'react-native'

<TouchableWithoutFeedback onPress={() => Keyboard.dismiss()}>
...
</TouchableWithoutFeedback>

Worked for me

@Idan 2019-08-12 15:15:21

There are a few ways, if you control of event like onPress you can use:

import { Keyboard } from 'react-native'

onClickFunction = () => {
     Keyboard.dismiss()
}

if you want to close the keyboard when the use scrolling:

<ScrollView keyboardDismissMode={'on-drag'}>
     //content
</ScrollView>

More option is when the user clicks outside the keyboard:

<KeyboardAvoidingView behavior='padding' style={{ flex: 1}}>
    //inputs and other content
</KeyboardAvoidingView>

@Link 2019-11-01 10:56:29

Guys, the question is still actual but question is 4 years old(end of 2019 now). RN now is soo simple and easy to use. We have to review all abilities with help of we can achieve solution for this question. Let upvote this comment!

@Artem Shevtsov 2019-08-07 17:02:56

Here is my solution for Keyboard dismissing and scrolling to tapped TextInput (I am using ScrollView with keyboardDismissMode prop):

import React from 'react';
import {
  Platform,
  KeyboardAvoidingView,
  ScrollView
} from 'react-native';

const DismissKeyboard = ({ children }) => {
  const isAndroid = Platform.OS === 'android';
  const behavior = isAndroid ? false : 'padding';

  return (
    <KeyboardAvoidingView
      enabled
      behavior={ behavior }
      style={{ flex: 1}}
    >
      <ScrollView
        keyboardShouldPersistTaps={'always'}
        keyboardDismissMode={'on-drag'}
      >
        { children }
      </ScrollView>
    </KeyboardAvoidingView>
  );
};

export default DismissKeyboard;

usage:

render(){
   return(
     <DismissKeyboard>
       <TextInput
        style={{height: 40, borderColor: 'gray', borderWidth: 1}}
        onChangeText={(text) => this.setState({text})}
        value={this.state.text}
      />
     </DismissKeyboard>
   );
}

@Alireza 2017-06-17 07:47:14

You can import keyboard from react-native like below:

import { Keyboard } from 'react-native';

and in your code could be something like this:

render() {
    return (
      <TextInput
        onSubmit={Keyboard.dismiss}
      />
    );
  }

static dismiss()

Dismisses the active keyboard and removes focus.

@SherylHohman 2018-04-30 07:49:54

I did not need static dismiss(). I just added Keyboard.dismiss() to my onSubmit method (where onSubmitEditing={() => {this.onSubmit()}})

@abhinandan sharma 2019-04-11 17:08:50

Keyboard module is used to control keyboard events.

  • import { Keyboard } from 'react-native'
  • Add below code in render method.

    render() { return <TextInput onSubmitEditing={Keyboard.dismiss} />; }

You can use -

Keyboard.dismiss()

static dismiss() Dismisses the active keyboard and removes focus as per react native documents.

@Amoli 2019-02-13 09:57:37

try out keyboard.dismiss(). It worked for me

@Scottmas 2018-04-13 21:14:52

Wrapping your components in a TouchableWithoutFeedback can cause some weird scroll behavior and other issues. I prefer to wrap my topmost app in a View with the onStartShouldSetResponder property filled in. This will allow me to handle all unhandled touches and then dismiss the keyboard. Importantly, since the handler function returns false the touch event is propagated up like normal.

 handleUnhandledTouches(){
   Keyboard.dismiss
   return false;
 }

 render(){
    <View style={{ flex: 1 }} onStartShouldSetResponder={this.handleUnhandledTouches}>
       <MyApp>
    </View>
  }

@kuhr 2020-03-17 10:53:33

Thanks for your answer @Scottmas. I ended up using it instead of TouchableWithoutFeedback, because of your "weird scroll behavior and other issues" comment. But if I wasn't blindly trusting your words, can you elaborate on your comment? :)

@Nagendra kr. 2018-10-12 14:20:36

First import Keyboard

import { Keyboard } from 'react-native'

Then inside your TextInput you add Keyboard.dismiss to the onSubmitEditing prop. You should have something that looks like this:

render(){
  return(
    <View>
      <TextInput 
        onSubmitEditing={Keyboard.dismiss}
       />
    </View>
  )  
}

@colidyre 2018-10-12 14:44:40

More context would be nice.

@Sarmad Shah 2018-12-15 18:07:21

There are many ways you could handle this, the answers above don't include returnType as it was not included in react-native that time.

1: You can solve it by wrapping your components inside ScrollView, by default ScrollView closes the keyboard if we press somewhere. But incase you want to use ScrollView but disable this effect. you can use pointerEvent prop to scrollView pointerEvents = 'none'.

2: If you want to close the keyboard on a button press, You can just use Keyboard from react-native

import { Keyboard } from 'react-native' and inside onPress of that button, you can useKeyboard.dismiss()'.

3: You can also close the keyboard when you click the return key on the keyboard, NOTE: if your keyboard type is numeric, you won't have a return key. So, you can enable it by giving it a prop, returnKeyType to done. or you could use onSubmitEditing={Keyboard.dismiss},It gets called whenever we press the return key. And if you want to dismiss the keyboard when losing focus, you can use onBlur prop, onBlur = {Keyboard.dismiss}

@Gant Laborde 2016-09-29 13:50:46

This just got updated and documented! No more hidden tricks.

import { Keyboard } from 'react-native'

// Hide that keyboard!
Keyboard.dismiss()

https://github.com/facebook/react-native/pull/9925

@sheepdog 2017-01-02 03:07:34

Thanks for adding this. I hope your answer bubbles up to the top. I almost missed it and used an outdated solution.

@jehna1 2017-01-10 13:54:27

Pinging @MrMuetze to change this as the correct answer

@jskidd3 2018-11-06 12:06:27

This shouldn't be the selected as the best answer. The question asks how to dismiss the keyboard when tapping outside of it. This answer simply provides an API for doing so, whilst the actual best answer provides a workable implementation.

@Alejandro Gonzalez 2020-01-07 13:49:48

you can use the next library : KeyboardAwareScrollView

@Eric Kim 2016-01-14 00:09:05

The problem with keyboard not dismissing gets more severe if you have keyboardType='numeric', as there is no way to dismiss it.

Replacing View with ScrollView is not a correct solution, as if you have multiple textInputs or buttons, tapping on them while the keyboard is up will only dismiss the keyboard.

Correct way is to encapsulate View with TouchableWithoutFeedback and calling Keyboard.dismiss()

EDIT: You can now use ScrollView with keyboardShouldPersistTaps='handled' to only dismiss the keyboard when the tap is not handled by the children (ie. tapping on other textInputs or buttons)

If you have

<View style={{flex: 1}}>
    <TextInput keyboardType='numeric'/>
</View>

Change it to

<ScrollView contentContainerStyle={{flexGrow: 1}}
  keyboardShouldPersistTaps='handled'
>
  <TextInput keyboardType='numeric'/>
</ScrollView>

or

import {Keyboard} from 'react-native'

<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
    <View style={{flex: 1}}>
        <TextInput keyboardType='numeric'/>
    </View>
</TouchableWithoutFeedback>

EDIT: You can also create a Higher Order Component to dismiss the keyboard.

import React from 'react';
import { TouchableWithoutFeedback, Keyboard, View } from 'react-native';

const DismissKeyboardHOC = (Comp) => {
  return ({ children, ...props }) => (
    <TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
      <Comp {...props}>
        {children}
      </Comp>
    </TouchableWithoutFeedback>
  );
};
const DismissKeyboardView = DismissKeyboardHOC(View)

Simply use it like this

...
render() {
    <DismissKeyboardView>
        <TextInput keyboardType='numeric'/>
    </DismissKeyboardView>
}

NOTE: the accessible={false} is required to make the input form continue to be accessible through VoiceOver. Visually impaired people will thank you!

@Pavle Lekic 2016-12-09 09:04:30

This is great, the only comment I have is that you could have used the official Keyboard api in RN, and called Keyboard.dismiss() instead of calling some RN internal utility dismissKeyboard(). But both work fine currently.

@Eric Kim 2017-03-23 00:37:37

@PavleLekic Sorry for the delay, I updated the answer along with the HOC method

@jwinn 2017-09-26 20:47:55

This works great. I had to change the syntax a little for the definition of the arrow function, to remove an unexpected token error in RN: const DismissKeyboardHOC = (Comp) => {

@Brad Ryan 2017-11-01 20:30:27

I can't get onPress for TouchableWithoutFeedback to fire no matter what I try

@Brad Ryan 2017-11-01 21:31:06

Turns out my TouchableWithoutFeedback component was just wrapping my input, and therefore wasn't triggering because I couldn't actually click on it (Clicking on TextInput overrides TouchableWithoutFeedback's `onPress' - makes sense). Had to zoom out and wrap the parent component.

@marco.marinangeli 2017-12-02 11:18:44

I used this solution, but then i discovered Accessibility problems. Voice will not work inside the TouchableWithoutFeedback element. Anyone with the same problem found a solution? EDIT: the solution was to simply set "accessible={false}" on the element!

@Jun711 2018-01-21 02:42:36

<TouchableWithoutFeedback onPress={this.press}> <View > <Text style={{fontSize: 20}}>test</Text> </View> </TouchableWithoutFeedback> It seems to work with Text but when I have a TextInput, the tap is not caught by the TouchableWithoutFeedback's onPress. Any idea how to make it work?

@Jun711 2018-01-21 03:16:44

My mistake. The onPress event was captured by other buttons in the parent container. But, it does work if there is no other component within the parent component to capture the touch event.

@James Trickey 2018-02-21 01:58:42

This is the solution i used and I thought it had worked. One of my views contains a ListView though and unfortunately it seems that swipes dont make it through the TouchableWithoutFeedback element. Has anyone else encountered this? Thanks

@Harikrishnan 2018-02-28 08:44:34

This solution will also work for text input inside List.

@Hobbyist 2018-04-15 14:34:29

This solution works, but please keep in mind that you can not use swipe gestures in children of a Touchable component.

@Anthony De Smet 2019-02-10 20:46:57

If you really just wanted a View and none of the ScrollView behaviour, it helps to add bounces={false} as a property to the ScrollView. Otherwise you get the elastic overscroll on iOS.

@Johncy 2019-05-27 14:12:15

Keyboard can not dismiss after use Alert ! TextInput has bluronSubmit={false}. Make the field focused and show some alert. After press ok on Alert, when i try to dismiss the keyboard tapping outside the TextInput is not working!

@Jason Sebring 2019-07-28 18:28:33

I won't downvote this but please remove it or change it as its incorrect and misleading. See 'onStartShouldSetResponder on a parent View' answers as the correct behavior with less effort.

@Dimitri Kopriwa 2020-04-26 15:52:35

Why create an HoC and just add this in the root of your app tree /

@Joshua Pinter 2016-04-30 18:46:30

Use React Native's Keyboard.dismiss()

Updated Answer

React Native exposed the static dismiss() method on the Keyboard, so the updated method is:

import { Keyboard } from 'react-native'; 

Keyboard.dismiss()

Original Answer

Use React Native's dismissKeyboard Library.

I had a very similar problem and felt like I was the only one that didn't get it.

ScrollViews

If you have a ScrollView, or anything that inherits from it like a ListView, you can add a prop that will automatically dismiss the keyboard based on press or dragging events.

The prop is keyboardDismissMode and can have a value of none, interactive or on-drag. You can read more on that here.

Regular Views

If you have something other than a ScrollView and you'd like any presses to dismiss the keyboard, you can use a simple TouchableWithoutFeedback and have the onPress use React Native's utility library dismissKeyboard to dismiss the keyboard for you.

In your example, you could do something like this:

var DismissKeyboard = require('dismissKeyboard'); // Require React Native's utility library.

// Wrap your view with a TouchableWithoutFeedback component like so.

<View style={styles.container}>

  <TouchableWithoutFeedback onPress={ () => { DismissKeyboard() } }>

    <View>

      <Text style={styles.welcome}>
        Welcome to React Native!
      </Text>

      <Text style={styles.instructions}>
        To get started, edit index.ios.js
      </Text>

      <Text style={styles.instructions}>
        Press Cmd+R to reload,{'\n'}
        Cmd+D or shake for dev menu
      </Text>

      <TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}} />

    </View>

  </TouchableWithoutFeedback>

</View>

Note: TouchableWithoutFeedback can only have a single child so you need to wrap everything below it in a single View as shown above.

@Joshua Pinter 2017-02-21 19:25:47

React Native exposed the static dismiss() method on the Keyboard, so the updated method is: import { Keyboard } from 'react-native'; Keyboard.dismiss().

@pstanton 2018-06-16 00:36:23

i have a keyboard that is hanging around since i did a reload while focused on an input field. in this case Keyboard.dismiss() does nothing since its implementation is dependent on being focused on an input, which I no longer am.

@Joshua Pinter 2018-06-17 00:44:11

@pstanton What did you have to do to dismiss the keyboard, then?

@pstanton 2018-06-17 22:52:56

There was no way I could find, so I force closed!

@Adeel Imran 2016-10-07 12:30:58

const dismissKeyboard = require('dismissKeyboard');
dismissKeyboard(); //dismisses it

Approach No# 2;

Thanks to user @ricardo-stuven for pointing this out, there is another better way to dismiss the keyboard which you can see in the example in the react native docs.

Simple import Keyboard and call it's method dismiss()

@Ricardo Stuven 2018-04-20 20:35:03

This is the exact equivalent of Keyboard.dismiss, which is preferable since is documented. github.com/facebook/react-native/blob/…

@Adeel Imran 2018-04-21 21:21:33

At the time I gave this answer, this was not documented. Thanks for mentioning it. I'll update my answer.

@syarul 2015-11-06 06:36:35

use this for custom dismissal

var dismissKeyboard = require('dismissKeyboard');

var TestView = React.createClass({
    render: function(){
        return (
            <TouchableWithoutFeedback 
                onPress={dismissKeyboard}>
                <View />
            </TouchableWithoutFeedback>
        )
    }
})

@syarul 2016-04-30 04:15:17

It's not documented, but the samples in react-native github repo does use it few times.

@Joshua Pinter 2016-04-30 18:16:43

Interesting, for those curious where this comes from, it's a Utility library in React Native. Here's the source: github.com/facebook/react-native/blob/master/Libraries/…

@Peter G. 2016-07-13 09:36:54

For some reason it didn't work, when I tried with react-native-search-bar

@Ricardo Stuven 2018-04-20 20:33:51

This is the exact equivalent of Keyboard.dismiss, which is preferable since is documented. github.com/facebook/react-native/blob/…

@hunteros 2015-08-11 00:58:16

I'm brand new to React, and ran into the exact same issue while making a demo app. If you use the onStartShouldSetResponder prop (described here), you can grab touches on a plain old React.View. Curious to hear more experienced React-ers' thoughts on this strategy / if there's a better one, but this is what worked for me:

containerTouched(event) {
  this.refs.textInput.blur();
  return false;
}

render() {
  <View onStartShouldSetResponder={this.containerTouched.bind(this)}>
    <TextInput ref='textInput' />
  </View>
}

2 things to note here. First, as discussed here, there's not yet a way to end editing of all subviews, so we have to refer to the TextInput directly to blur it. Second, the onStartShouldSetResponder is intercepted by other touchable controls on top of it. So clicking on a TouchableHighlight etc (including another TextInput) within the container view will not trigger the event. However, clicking on an Image within the container view will still dismiss the keyboard.

@mutp 2015-08-22 09:35:56

It definitely works. But as you said, Im curious as well if this is the right way. Hope they solve it soon (github.com/facebook/react-native/issues/113 )

@James Trickey 2018-02-21 02:10:29

Great this worked for me. My scroll view was not working with the touchable methods! Thanks!

@Tyler McGinnis 2015-07-19 17:44:10

Use ScrollView instead of View and set the keyboardShouldPersistTaps attribute to false.

<ScrollView style={styles.container} keyboardShouldPersistTaps={false}>
    <TextInput
        placeholder="Post Title"
        onChange={(event) => this.updateTitle(event.nativeEvent.text)}
        style={styles.default}/>
 </ScrollView>

@TurboFish 2015-07-20 12:46:48

According to the documentation, the keyboardShouldPersistTaps attribute defaults to false when using a ScrollView. I just updated my react-native to the latest version and the problem with switching to a second TextInput still persists. The keyboard then is not dismissible. Have you found a solution for this specific problem?

@Ryan McDermott 2015-10-09 16:24:49

The docs were incorrect, but have now been updated, see this PR: github.com/facebook/react-native/issues/2150

@Lane Rettig 2016-02-04 22:24:19

What does keyboardShouldPersistTaps do? Why is it relevant here? Thanks

@Milan Rakos 2018-04-04 08:05:54

Warning: 'keyboardShouldPersistTaps={false}' is deprecated. Use 'keyboardShouldPersistTaps="never"' instead

@boredgames 2015-05-01 03:19:54

How about placing a touchable component around/beside the TextInput?

var INPUTREF = 'MyTextInput';

class TestKb extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <View style={{ flex: 1, flexDirection: 'column', backgroundColor: 'blue' }}>
                <View>
                    <TextInput ref={'MyTextInput'}
                        style={{
                            height: 40,
                            borderWidth: 1,
                            backgroundColor: 'grey'
                        }} ></TextInput>
                </View>
                <TouchableWithoutFeedback onPress={() => this.refs[INPUTREF].blur()}>
                    <View 
                        style={{ 
                            flex: 1, 
                            flexDirection: 'column', 
                            backgroundColor: 'green' 
                        }} 
                    />
                </TouchableWithoutFeedback>
            </View>
        )
    }
}

@austin reynolds 2017-01-30 13:33:06

If any one needs a working example of how to dismiss a multiline text input here ya go! Hope this helps some folks out there, the docs do not describe a way to dismiss a multiline input at all, at least there was no specific reference on how to do it. Still a noob to actually posting here on the stack, if anyone thinks this should be a reference to the actual post this snippet was written for let me know.

import React, { Component } from 'react'
import {
  Keyboard,
  TextInput,
  TouchableOpacity,
  View,
  KeyboardAvoidingView,
} from 'react-native'

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      behavior: 'position',
    }
    this._keyboardDismiss = this._keyboardDismiss.bind(this)
  }

  componentWillMount() {
    this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide);
  }

  componentWillUnmount() {
    this.keyboardDidHideListener.remove()
  }

  _keyboardDidHide() {
    Keyboard.dismiss()
  }

  render() {
    return (
      <KeyboardAvoidingView
        style={{ flex: 1 }}
        behavior={this.state.behavior}
      >
        <TouchableOpacity onPress={this._keyboardDidHide}>
          <View>
            <TextInput
              style={{
                color: '#000000',
                paddingLeft: 15,
                paddingTop: 10,
                fontSize: 18,
              }}
              multiline={true}
              textStyle={{ fontSize: '20', fontFamily: 'Montserrat-Medium' }}
              placeholder="Share your Success..."
              value={this.state.text}
              underlineColorAndroid="transparent"
              returnKeyType={'default'}
            />
          </View>
        </TouchableOpacity>
      </KeyboardAvoidingView>
    )
  }
}

@Bruce Xinda Lin 2018-03-26 22:52:35

Keyboard.dismiss() will do it. But sometimes it may lose the focus and Keyboard will be unable to find the ref. The most consistent way to do is put a ref=_ref to the textInput, and do _ref.blur() when you need to dismiss, and _ref.focus() when you need to bring back the keyboard.

@gamingumar 2017-12-31 12:05:54

in ScrollView use

keyboardShouldPersistTaps="handled" 

This will do your job.

@Krishnendu Bhattacharyya 2017-05-23 09:45:25

https://facebook.github.io/react-native/docs/keyboard.html

Use

Keyboard.dismiss(0);

to hide the keyboard.

@Samuel 2017-05-01 16:45:16

Using keyboardShouldPersistTaps in the ScrollView you can pass in "handled", which deals with the issues that people are saying comes with using the ScrollView. This is what the documentation says about using 'handled': the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor). Here is where it's referenced.

@Nick Grealy 2018-01-13 12:20:47

This worked for me! (however I had to add it inside my 3rd party library react-native-keyboard-aware-scroll-view).

@Anshul Koka 2017-01-12 21:24:16

Updated usage of ScrollView for React Native 0.39

<ScrollView scrollEnabled={false} contentContainerStyle={{flex: 1}} />

Although, there is still a problem with two TextInput boxes. eg. A username and password form would now dismiss the keyboard when switching between inputs. Would love to get some suggestions to keep keyboard alive when switching between TextInputs while using a ScrollView.

@Anshul Koka 2017-01-12 22:32:21

It appears that 0.40 updates keyboardShouldPersistTaps from a boolean to an enum with a possible value of 'handled` which is suppose to fix this.

@TurboFish 2015-04-21 12:04:32

The simple answer is to use a ScrollView instead of View and set the scrollable property to false (might need to adjust some styling though).

This way, the keyboard gets dismissed the moment I tap somewhere else. This might be an issue with react-native, but tap events only seem to be handled with ScrollViews which leads to the described behaviour.

Edit: Thanks to jllodra. Please note that if you tap directly into another Textinput and then outside, the keyboard still won't hide.

@Piyush Chauhan 2015-06-10 07:45:31

It works with scrollview but still there are some cases i'm experiencing where I can click button to change the view using navigator and keyboard still sticks at the bottom and have to manually click return key to close it :(

@jllodra 2015-06-17 19:28:43

Keyboard hides when you tap outside the TextInput, but if (instead of tapping outside) you tap into another TextInput, and finally tap outside, the keyboard does not hide. Tested on 0.6.0.

@Lane Rettig 2016-02-04 22:22:24

I'm seeing different behavior now. Tapping outside the TextInput hides the keyboard, even if I tap directly onto another TextInput--which is a problem because you have to tap twice on another TextInput to be able to type into it! Sigh. (with RN 0.19)

@Eric Wiener 2018-08-16 22:06:23

You can set scrollable to true and use keyboardShouldPersistTaps={'handled'} and keyboardDismissMode={'on-drag'} to achieve the same effect

@Yvon Huynh 2020-04-15 07:02:19

only scrollview worked for me I don't know why,the accepted answer when i input a number keyboard dismisses

@Jonathan Huang 2015-05-12 04:39:37

I just tested this using the latest React Native version (0.4.2), and the keyboard is dismissed when you tap elsewhere.

And FYI: you can set a callback function to be executed when you dismiss the keyboard by assigning it to the "onEndEditing" prop.

@TurboFish 2015-05-12 21:36:11

I was debugging the "onEndEditing" callback, but it never triggered before; I'm going to look into this with the newer version of react native, thanks for your suggestion

@christopherdro 2015-05-06 17:59:39

If i'm not mistaken the latest version of React Native has solved this issue of being able to dismiss the keyboard by tapping out.

@Okazaki Miyama Yuta 2015-05-07 15:54:04

Would you be able to point out which part of their code/doc does that? I'm running into the same issue, and I really appreciate it pointing me the direction :)

@Lane Rettig 2016-02-04 22:54:44

Confirmed that this is still an issue as of RN 0.19 (the latest).

@hippofluff 2016-08-19 13:49:28

Still an issue with RN 0.28

Related Questions

Sponsored Content

37 Answered Questions

[SOLVED] What is the difference between React Native and React?

31 Answered Questions

[SOLVED] React Native android build failed. SDK location not found

  • 2015-09-17 15:30:13
  • Pyae Sone Nyein
  • 338238 View
  • 480 Score
  • 31 Answer
  • Tags:   android react-native

3 Answered Questions

[SOLVED] Setting a border for react native TextInput

1 Answered Questions

[SOLVED] changes made in app.js file in react native project are not reflecting

5 Answered Questions

6 Answered Questions

1 Answered Questions

[SOLVED] Changes don't reflect in simulator after cmd+r

  • 2016-11-26 17:07:16
  • André Santos
  • 441 View
  • 0 Score
  • 1 Answer
  • Tags:   react-native

1 Answered Questions

Sponsored Content