mpvue中echart加载

//template
<ul class="tab" @click="current" :key="id">
    <li @click="cur=0" :class="{active:cur==0}">1</li>
    <li @click="cur=1" :class="{active:cur==1}">2</li>
    <li @click="cur=2" :class="{active:cur==2}">3</li>
</ul>
<div v-show="cur===0">
    <div class="week" v-if="cur===0&&echartsData==true">
        <mpvue-echarts :echarts="echarts" :onInit="ecBarInit0" canvasId="bar0" />
    </div>
</div>
<div v-show="cur===1">
    <div class="week" v-if="cur===1&&echartsData==true">
        <mpvue-echarts :echarts="echarts" :onInit="ecBarInit1" canvasId="bar1" />
    </div>
</div>
<div v-show="cur===2">
    <div class="week" v-if="cur===2&&echartsData==true">
        <mpvue-echarts :echarts="echarts" :onInit="ecBarInit2" canvasId="bar2" />
    </div>
</div>
//js 
let echarts = require("../../../static/echarts.min");
import mpvueEcharts from"mpvue-echarts"; 
let poplechart

    export default {
        data() {
            return {
                echarts,
                cur: 0, //默认选中第一个tab
                value: '',
                echartsData: false
            }
        },
        methods: {
            //人工收费
            ecPopleInittwo: function (canvas, width, height) {
                var that = this;
                poplecharttwo = echarts.init(canvas, null, {
                     width,
                    height: height
                });
                canvas.setChart(poplecharttwo);
                poplecharttwo.setOption({
                    title: [],
                    tooltip: {
                        trigger: "axis"
                    },
                    legend: {
                        data: ["bala", "balala"],
                        orient: "vertical",
                        left: 10
                    },
                    grid: {
                        top: "22%",
                        left: "3%",
                        right: "6%",
                        bottom: "14%",
                        height: "70%",
                        containLabel: true
                    },
                    xAxis: [
                        {
                            type: "category",
                            boundaryGap: false,
                            data: that.one
          }
        ],
                    yAxis: [
                        {
                            type: "value"
          }
        ],
                    series: [
                        {
                            name: "次数",
                            type: "line",
                            data: that.two,
                            color: "#1296db"
          },
                        {
                            name: "金额",
                            type: "line",
                            data: that.three,
                            color: "red"
          }
        ]
                });
                return poplecharttwo;
            },
            //获取数据
            login() {
                wx.showLoading({
                    title: "加载中"
                });
            },
            echartsdatas() {

                let that = this;

                let promise1 = new Promise(function (resolve, reject) {
                        wx.request({
                                url: that.url,
                                method: "POST",
                                header: {
                                    "content-type": "application/json"
                                },
                                data: {

                                },
                                success: function (res) {
                                    resolve(res);

                                }
                            }
                        });
                });
            let promise2 = new Promise(function (resolve, reject) {
                    wx.request({
                            url: that.url,
                            method: "POST",
                            header: {
                                "content-type": "application/json"
                            },
                            data: {

                            },
                            success: function (res) {
                                resolve(res);

                            }
                        }
                    });
            });

        let promise3 = new Promise(function (resolve, reject) {
                wx.request({
                        url: that.url,
                        method: "POST",
                        header: {
                            "content-type": "application/json"
                        },
                        data: {

                        },
                        success: function (res) {
                            resolve(res);

                        }
                    }
                });
        });
Promise.all([promise1, promise2, promise3])
    .then(result => {
        that.echartsData = true;
        wx.hideLoading();
    })
    .catch(error => {
        console.log(error);
    });
},

current(e) {
    this.value = e.target.dataset.eventid; //获取ul li下标
},
}
}
//css
ul li {
    margin: 0;
    padding: 0;
    list - style: none;
}
.tab {
    display: flex;
    border - bottom: 2 px solid# ddd;
}
.tab li {
    flex: 1;
    font - size: 14 px;
    text - align: center;
    padding: 10 px 0;
}
.tab li.active {
    color: red;
    border - bottom: 3 px solid red;
}