I have 2 questions related to this, using React as the view layer.
1 - What’s the best way to show a different layout for mobile clients?
Is the best option to do the following inside render() ?
if (mobile)
return < MobileView> … </>
else
return < DesktopView> … </>
This would also have to be done in relevant child components but seems the most straight forward.
2 - Handle Mouse/Click events
I want to display a mouseover UI on desktop, with some added functionality (e.g. Netflix’s popover with add to queue) and replace that with a select/toggle on mobile.
Is there a good pattern for this or a react component which can be used easily? e.g. if use TapEventPlugin I can use onTouchTap, then I also have to conditionally handle onClick, mouseEnter, mouseOut etc, and conditionally combine all of them.
The same logic applies to showing a hover dropdown menu. I’m hoping there’s a pattern/component to handle this nicely?