vue中引入echarts提示 Uncaught Error: Initialize failed: invalid dom.

错误原因没有找到dom这个元素
当使用Vue created 方法时 去初始化echarts的时候 便会有以下提示：

created 只是完成了初始化vue的工作还没有完成挂载 如果这个时候调用echarts的init 就会发现dom无效 所以会提示 invalid 因为dom这时候还没有没初始化出来
因为 我们可以使用mounted 函数 让dom 先完成 初始化在进行调用的时候，echarts就可以完成初始化了

<script>
    var app = new Vue({
        el: '#app',
        created:function () {
          alert("Vue 初始化成功")
        },
        mounted:function () {
            //在这里完成对echarts的初始化工作
            this.drawPie('main')
        },
        methods:{
            drawPie(id){
                alert("drawPie被调用")
                console.log(document.getElementById(id))
                this.charts = echarts.init(document.getElementById(id))
                this.charts.setOption({
                    tooltip: {
                        trigger: 'item',
                        formatter: '{a}
{b}:{c} ({d}%)'
                    },
                    legend: {
                        orient: 'vertical',
                        x: 'left',
                        data:this.opinion
                    },
                    series: [
                        {
                            name:'访问来源',
                            type:'pie',
                            radius:['50%','70%'],
                            avoidLabelOverlap: false,
                            label: {
                                normal: {
                                    show: false,
                                    position: 'center'
                                },
                                emphasis: {
                                    show: true,
                                    textStyle: {
                                        fontSize: '30',
                                        fontWeight: 'blod'
                                    }
                                }
                            },
                            labelLine: {
                                normal: {
                                    show: false
                                }
                            },
                            data:this.opinionData
                        }
                    ]
                })
            }


        },
//   data 数据对象
        data: {
                charts: '',
                opinion:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎'],
                opinionData:[
                    {value:335, name:'直接访问'},
                    {value:310, name:'邮件营销'},
                    {value:234, name:'联盟广告'},
                    {value:135, name:'视频广告'},
                    {value:1548, name:'搜索引擎'}
                ]
        }






    })




</script>

这样子就当网页加载完可以显示出来图表了