CODEWITHSUNDEEP
javascriptruby-on-railsreactjsreact-rails
Jay Deuskar
Jay Deuskar

Reputation: 63

React component is being rendered, then disappears

Sorry in advance if this question if difficult to understand - not really sure how to ask it.

Basically, I have two React components in my rails view that take props of a 'metric' and an 'id'. 

    <div class="col-lg-6">
       <%= react_component 'Chart', {initialList: current_user.lists.first, url: get_data_path, metric: 'click_rate', id: 'click-rate', title: 'Click Rates', user_id: current_user.id} %>
    </div>
  </div>
  <div class="row">
    <div class="col-lg-6">
      <%= react_component 'Chart', {initialList: current_user.lists.first, url: get_data_path, metric: 'open_count', id: 'open-count', title: 'Open Counts', user_id: current_user.id} %>
    </div>

In the Chart component, it takes the metric and makes a call to the server to grab the appropriate data. While the components work how they should, the problem is that it will graph the first graph but when it graphs the second one, the first graph disappears.

Here's the Chart.js.jsx component: https://gist.github.com/coffeejay/ea5cf8e8c3dcd09e58f6

Edit

The Chart component has another component called FlotBar (based on Flotchart) inside it. Code : https://gist.github.com/coffeejay/1872d3d8bd1ddcb3c228

Thanks for the help!

Upvotes: 2

Views: 4366

Answers (1)

Isto Barton
Isto Barton

Reputation: 93

I was having a similar problem today. What ended up being the problem for me was that React was basing its code off of my bundle.js that was being compiled by Gulp -- but Gulp had stopped compiling my code. I restarted my server and Gulp and my code fixed itself.

Before React would render the correct code and then immediately switch back to my old, shitty code. It wasn't until I started making drastic changes to my code that I realized nothing was being updated.

If you're using webpack, gulp, grunt, or any other auto-compiler, try restarting to make sure that the code you're loading is up to date.

Upvotes: 1

Related Questions