Closed Rubenvdveen closed 3 years ago
Do you have body scroll? You can't have body scroll in React Native Web apps
You should use it inside a
<ScrollView></ScrollView>
Hmm I have the same problem now :-D
Nevermind, it was because expo does allow body scroll by default. You should be fine by something like this in your css
body,html,#root{min-height:100%;height:100%;max-height:100%;overflow:hidden;}
And use a ScrollView for the elements
For expo users, wrap your whole app in a custom View
export default function App() {
return (
<View
style={
Platform.OS === 'web' ? { flex: 1, maxHeight: '100vh' } : { flex: 1 }
}
>
<PaperProvider>
<AppInner />
</PaperProvider>
</View>
);
}
Please update to v0.2.0, I think I fixed the issue you are describing by recalculating the position if the user clicks the element
Thanks for the updates, it seems to work fine using a scrollview and the View wrapped around the App component, but there is one new problem now:
When having the autocomplete focussed, it's impossible to scroll.
Video: https://youtu.be/0yGnSWfeleM
When having a selected value once, focussing the field which is lower than the top scroll causes the X mark and dropdown items to pop up at the top of the scrollview.
Image how it's supposed to work:
Image after selecting a value once and re-focussing: