<View>
<TextInput placeholder="This works" />
<View>
<TextInput placeholder="This doesn't work" />
</View>
</View>
The sample project with this bug is here – https://github.com/boopathi/textinputbug
Am I doing something wrong here ?
Filtering out the most rated answers from issues on Github |||||||||||_______|||| Also a sharing corner
<View>
<TextInput placeholder="This works" />
<View>
<TextInput placeholder="This doesn't work" />
</View>
</View>
The sample project with this bug is here – https://github.com/boopathi/textinputbug
Am I doing something wrong here ?
<View>
<TextInput placeholder="This works" />
<View>
<TextInput placeholder="This doesn't work" />
</View>
</View>
The sample project with this bug is here – https://github.com/boopathi/textinputbug
Am I doing something wrong here ?
For people looking here for a solution, without understanding/going through someone’s code:
Specify a height to the TextInput seemed to fix the problem of it not working.
Example:
<View>
<View>
<TextInput
style={styles.input}
onChangeText={(text) => this.setState({ input: text })}
placeholder="Input Here"
/>
</View>
</View>
const styles= StyleSheet.create({
input: {
height: 20, //comment this out and TextInput wont work (some cases the grey background wont be there)
width: 100,
background: 'grey, //added for visual
},
});
Copyright © 2021 Fantas...hit
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
Cookie | Duration | Description |
---|---|---|
cookielawinfo-checbox-analytics | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics". |
cookielawinfo-checbox-functional | 11 months | The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional". |
cookielawinfo-checbox-others | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other. |
cookielawinfo-checkbox-necessary | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary". |
cookielawinfo-checkbox-performance | 11 months | This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance". |
viewed_cookie_policy | 11 months | The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data. |
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
So interestingly the work’s already been done to support this.
RCTView
will hit test its subviews regardless of whether they’re in its bounds iffpointerEvents
isbox-none
: https://github.com/facebook/react-native/blob/f3cd27cf483671b8821e4f50bfa7bb370893e59a/React/Views/RCTView.m#L126-136And indeed, if we use the original example in https://github.com/boopathi/textinputbug/blob/326362e5d39588682048bccda281d6bb2701d04a/index.ios.js with💥
pointerEvents='box-none'
on the problem parent views, it works as expectedSo making this “just work” seems to only be a matter of changing the default
pointerEvents
, or changing the behavior ofRCTPointerEventsUnspecified
to fallback to searching its subviews.For people looking here for a solution, without understanding/going through someone’s code:
Example: