When I have on my screen InputAccessoryView which has component without nativeID (So it is constantly showing even if the keyboard is not shown) and I open and close Modal (react-native modal) then InputAccessoryView disappear from the screen with the component. I don't know why this is happening and also I don't know how to keep this InputAccessoryView on the screen.
Here is the code to reproduce it:
import * as React from 'react';import { View, ScrollView, AppRegistry, TextInput, InputAccessoryView, Button } from 'react-native';import {Modal, Text, TouchableHighlight, Alert} from 'react-native';import Constants from 'expo-constants';export default class App extends React.Component {constructor(props) { super(props); this.state = {text: 'Placeholder Text', modalVisible: false,}; } setModalVisible(visible) { this.setState({modalVisible: visible}); } render() { return (<View style={{flex:1}}><Modal animationType="slide" transparent={false} visible={this.state.modalVisible} onRequestClose={() => { Alert.alert('Modal has been closed.'); }}><View style={{marginTop: 22, padding: 50, backgroundColor: '#0066ff'}}><View><TouchableHighlight onPress={() => { this.setModalVisible(!this.state.modalVisible); }}><Text style={{color:"#ffffff"}}>Hide Modal</Text></TouchableHighlight></View></View></Modal><ScrollView style={{ backgroundColor: '#6ED4C8'}}><Text></Text><TouchableHighlight onPress={() => { this.setModalVisible(true); }}><Text style={{padding: 40, backgroundColor: "#ff3300"}}>Show Modal</Text></TouchableHighlight></ScrollView><InputAccessoryView backgroundColor="#ff9900"><TextInput style={{ padding: 20, paddingTop: 50, }} onChangeText={text => this.setState({text})} value={this.state.text} /></InputAccessoryView></View> ); }}Here you can find the online version (Keep in mind that the issue is only relevant for IOS): https://snack.expo.io/SJB7ipm6B
Some Images:
Image may be NSFW.
Clik here to view.
Image may be NSFW.
Clik here to view.
Image may be NSFW.
Clik here to view.
Thank you for your time and your help!
