Description
Using RN v0.45.0-rc.1
This is quite a doozy so apologies in advance for my poor attempt to explain it.
I'm doing a standard filtering based on a search textinput on a SectionList, almost exactly as the example in the SectionList illustrates (see the example on the bottom of the page here: https://facebook.github.io/react-native/docs/sectionlist.html)
This example assumes that there will always be some data that is hard coded in, which is not the case in the real world.
For some reason, if the search/filter text entered into the textinput here doesn't match, it seems like the entire search input may be re-rendered - and the focus on the textinput is lost.
I found a way around that:
var data = [{ data: [], key: 'no-results' }]
and then go from there. This allows the SectionList/TextInput search pattern to work correctly - that is, if there are no results, the textinput doesn't lose focus.
The issue then becomes the ListEmptyComponent element. On a standard FlatList, this works as expected. But on a SectionList, the only way that it will correctly render the EmptyList element is if its passed an empty array into its data prop.
But this puts me back at square one - passing in an empty array to the section list's data prop, for some reason, causes the search bar/text input to lose focus (when no results are returned from the search/filtering).