clayrisser / react-gantt

A gantt chart for react
https://codejam.ninja
MIT License
150 stars 40 forks source link

Showing the table on resize only #17

Open KhushilMistry opened 5 years ago

KhushilMistry commented 5 years ago

Uncaught TypeError: Cannot read property 'offsetWidth' of undefined at ReactGantt.handleResize (index.js:108) at index.js:93

Can you guide me here little?

clayrisser commented 5 years ago

Would you mind reproducing the error in a sample repo and sending me the link?

KhushilMistry commented 5 years ago

Before Resizing

screenshot 2018-11-21 at 2 40 01 pm

After Resizing

screenshot 2018-11-21 at 2 40 12 pm

Repo : https://github.com/KhushilMistry/Managi

Clone the repo. Commands to star: yarn && yarn start Go to: http://localhost:3000/signin Credentials: Email: khushil324@gmail.com Password: kbm123 Select any team from the following list. Go to Gantt Chart Tab.

KhushilMistry commented 5 years ago

https://github.com/codejamninja/react-gantt/blob/e42da2d7ed75353aa18d3c95e17838c3484c0fc5/src/index.js#L98-L101

Here, this.refs.timeline.offsetWidth is getting undefined after the mounting of the initial screen. So it's showing an error. Giving it some initial condition will solve the error. Something like this.

handleResize() { 
   this.setState({ timelineWidth: 0 }); 
   this.setState({ timelineWidth: this.refs.timeline.offsetWidth || 1020 }); 
 } 

What do you think ? @codejamninja

clayrisser commented 5 years ago

I should get a chance to look at this issue sometime this week.

thomaskleiven commented 5 years ago

+1

@codejamninja did you get a chance to look at this? Would be cool because it is really a useful library :)

clayrisser commented 5 years ago

@thomaskleiven thank you for reminding me. I will get to it soon.