0

I render my application using react-rails gem, within erb template, but there is problem - template rendered two times, so I have two rendered react apps at the same time. There is no way for me to affect that logic, I just adding new feature to existing project that used that system for navigation between vertical and horizontal view(depends on screen orientation make one of template visible). So, after rendering apps, for vertical view everything is okay(probably because it rendered first), but when switch to horizontal - it still focused on vertical app version(that is not visible when we on horizontal view), so my horizontal-view version of app is dead.

What is the best way to handle this situation, without crashing common navigation logic? Wanna mention 2 things: - that another parts of project use jQuery(my part is first injection of React in that project); - it's not possible to render template only ones.

I'm not hoping to find some clear solution for that issue, because original logic is not very smart-builded. Will be glad to any help.

P.S. if I would implement that from client side, I would add some class to container element, depends on orientation mode, and then render content to it, but it's not the case

Gordienko R.
  • 331
  • 4
  • 16
  • So, what's your code that grabs the focus? and how do the site know which render to use (media queries?)? Just guessing but I imagine the problem is that, as you have the same view twice, all ID are duplicated, so if you do something like `$('#some_id').focus()` it will target only the first one. – arieljuod Dec 10 '18 at 13:28
  • Depends on screen proportions it makes needed layout visible. I can't share actual code, but it is ordinary react component that render content, and then according react-rails gem I put it to my template like this: <%= react_component("HelloWorld", { greeting: "Hello from react-rails." }) %> – Gordienko R. Dec 10 '18 at 14:13
  • Yeap, it's media queries. – Gordienko R. Dec 10 '18 at 14:32

0 Answers0