React-chartjs不起作用

Question

我正在尝试在我的项目中使用react-chartjs，但它似乎不起作用......

我正在使用react-router加载此页面（主页）：

import React from 'react';
import { TextField, RaisedButton } from 'material-ui';
import { History } from 'react-router';
import Chart from './widgets/Chart.js';


const Home = React.createClass({

    getInitialState() {
        return {
        };
    },

    componentDidMount() {
    },

    toggleNotification() {

    },

    render() {

        return (
            <div>
                <Chart/>
            </div>
        )
    }
});

export default Home;

和Chart引用此文件：

import React from 'react';
import Chart from 'chart.js';
import {LineChart} from 'react-chartjs';

function rand(min, max, num) {
    var rtn = [];
    while (rtn.length < num) {
        rtn.push((Math.random() * (max - min)) + min);
    }
    return rtn;
}

const ChartWidget = React.createClass({

    getInitialState() {
        return {
            chartData : {
            labels: ["January", "February", "March", "April", "May", "June", "July"],
            datasets: [
                {
                    label: "My First dataset",
                    fillColor: "rgba(220,220,220,0.2)",
                    strokeColor: "rgba(220,220,220,1)",
                    pointColor: "rgba(220,220,220,1)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(220,220,220,1)",
                    data: [5, 8, 2, 0, 1, 2, 0]
                },
                {
                    label: "My Second dataset",
                    fillColor: "rgba(151,187,205,0.2)",
                    strokeColor: "rgba(151,187,205,1)",
                    pointColor: "rgba(151,187,205,1)",
                    pointStrokeColor: "#fff",
                    pointHighlightFill: "#fff",
                    pointHighlightStroke: "rgba(151,187,205,1)",
                    data: [-2, -5, 0, -3, -1, 0, -1]
                }
            ]
        }};
    },

    componentDidMount() {
    },

    toggleNotification() {

    },

    render() {
        return (
                <LineChart data={this.state.chartData} redraw width="600" height="250" />
        )
    }
});

export default ChartWidget;

我得到的错误：
Warning: 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 {ChartWidget {1}} {ChartWidget {1}}

只能告诉我我做错了什么？

使用：
的WebPack
Hotloaders
React.js
反应路由器
反应-chartjs 材料的UI

Answer 1

尝试以这种方式导入 LineChart ：

const LineChart = require('react-chartjs').Line;

并删除：

import {LineChart} from 'react-chartjs';