在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 定義在vue實例內部的echarts實例,如何將vue實例里面的數據賦值到ech

定義在vue實例內部的echarts實例,如何將vue實例里面的數據賦值到echarts實例中?

圖片描述

我定義了一個vue實例,在data里面還定義了很多數據。比如hangzhou等等,用來不同的切換。
圖片描述
圖片描述

我在這個vue實例里面,定義了echarts實例,現在想把vue實例里面data的數據賦值給echarts,就像我注釋掉的那一部分,我一那樣賦值,就報錯了?,F在都是寫的死數據,不能變動。這個數據要怎么賦值才行呀?

回答
編輯回答
涼心人

給你個思路 在線查看
更改數據的時候,通過自己定義的echarts.setOption(更改的數據)

step1:定義一個初始option數據,以及mycharts
step2:在mounted生命周期,將option賦值給mycharts
step3:點擊按鈕后,觸發(fā)事件,在事件里定義臨時變量,將option賦值給臨時變量,同時更改臨時變量的數據,然后將更改后的臨時變量賦值給mycharts
<div id="app">
     <div id="main" style="width: 600px;height:400px;"></div>
     <button @click="change">更改數據</button>
</div>
<script>
    new Vue({
        el: "#app",
        data() {
            return {
              myChart:'',
              option:{
                  title: {
                      text: 'ECharts 1'
                  },
                  tooltip: {},
                  legend: {
                      data:['銷量']
                  },
                  xAxis: {
                      data: ["襯衫","羊毛衫","雪紡衫","褲子","高跟鞋","襪子"]
                  },
                  yAxis: {},
                  series: [{
                      name: '銷量',
                      type: 'bar',
                      data: [5, 20, 36, 10, 10, 20]
                  }]
              }
            }
        },
        mounted:function(){
          this.myChart = echarts.init(document.getElementById('main'));
          this.myChart.setOption(this.option1);
        },
        methods:{
            change:function(){
                var temp = this.option;
                temp.series[0].data=[10, 5, 3, 6, 10, 20];
                this.myChart.setOption(temp);
            }
        }
    })
</script>
2017年8月1日 04:37