解决vue用chart组件不渲染问题

在组件linechart里这么写

<script>
    import { Line } from 'vue-chartjs';

    export default {
        extends: Line,
        data() {
            return {
                datacollection: {

                        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
                        datasets: [{
                                label: 'success',
                                backgroundColor: '#FC2525',
                                fill: 'transparent',
                                data: [40, 39, 10, 40, 39, 80, 40]
                            },
                            {
                                label: 'fail',
                                backgroundColor: '#05CBE1',
                                fill: 'transparent',
                                data: [60, 55, 32, 10, 2, 12, 53]
                            }
                        ]
                    }

            }
        },
        mounted() {
            console.log("slkslkf");
            this.renderChart(this.datacollection, {
                responsive: false,
                maintainAspectRatio: false
            })

        }
    }
</script>

然后在要用的地方 （dashboard）里面引入注册之后 要手动设置 长和高 要不然inspect每次都是height=0 这个组件每次都出不来 我也觉得非常迷

 <line-chart :width="1675" :height="250"></line-chart>