CODEWITHSUNDEEP
javascriptreactjsd3.jsreact-props
Vahagn
Vahagn

Reputation: 77

How to get data as props inside other file?

I have a react app

I need on chart.js change arcsData to data from App.js > rectangle data, it onClick function (App.js >286) give data (data: {name: "XXXXXXXXXXXXX", DateRange: "January 2002 - April 2002", Duration: 0.3333333333332333}).

In App.js rectangle show name: value I need that char.js show DateRange: value from rectangle data.

To view it, click on Blue circle > Experience > and then opens 7 rectangles > chart is appears when click on rectangle.

Each time on click a rectangle it get new data (can see on console).

Thanks.

Upvotes: 1

Views: 77

Answers (1)

Dyo
Dyo

Reputation: 4464

My updates in this codesandbox https://codesandbox.io/s/ymp6rrl199

You can see I use the state to render the chart with the selectedRectangle dateRange value :

<div id="chart">
     {this.state.selectedRectangle && (
         <Chart dateRange={this.state.selectedRectangle.DateRange} />
     )}
</div>

State is updated onClick on a rectangle : (App.js: 297)

onClick={() => {
  this.setState({
    selectedRectangle: node.data
  });
}}

Then access dateRange in chart.js with :

this.props.dateRange

Please use the state like this instead of all the forceUpdate() you do, you should never use it.

Upvotes: 1

Related Questions