React.createElement: type should not be null, undefined, boolean, or number

[merlinstardust]

I set the height / width of my chart depending on where I'm placing (full page, sidebar, etc).

import {DoughnutChart} from 'react-chartjs'; // edited to add this

const height = this.props.height || 300;
return (<DoughnutChart data={data} height={height} />);

This throws an error unfortunately complaining that height expects a string.

Edit to add error

React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of 

What's a way around this?

[lotar]

@merlinpatt http://www.w3schools.com/jsref/jsref_tostring_number.asp

const height = this.props.height || 300;
return (<DoughnutChart data={data} height={height.toString()} />);

:D

[merlinstardust]

@lotar Thank you for the tip. I'll use that for now, but this would be great if it were part of the package. I'll hopefully be able to make a PR at some point. @jhudson8 would this be of interest to you to add to the package?

[merlinstardust]

@lotar @jhudson8 I've discovered my issue and changed the title and description to reflect it better. The issue was not with dynamic height / width. It was that I'm using ES2015 syntax to import this package and I had assumed the incorrect name to import.

If you want to use DoughnutChart or BarChart, etc, with ES2015, you need to import {Doughnut as DoughnutChart, Bar as BarChart} from 'react-chartjs'

I'm closing this issue but I think a simple fix would be to put this solution in the documentation