Heim > Web-Frontend > View.js > Wie verwende ich Hervorhebungen in Vue? Methodeneinführung

Wie verwende ich Hervorhebungen in Vue? Methodeneinführung

青灯夜游
Freigeben: 2020-11-11 18:01:36
nach vorne
2690 Leute haben es durchsucht

Wie verwende ich Hervorhebungen in Vue? In der folgenden vue.js-Kolumne erfahren Sie, wie Sie Hightchats in Vue verwenden. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Wie verwende ich Hervorhebungen in Vue? Methodeneinführung

Verwendung von Highcharts

npm install highcharts --save
Nach dem Login kopieren

2. Erstellen Sie eine Diagrammkomponente

import Highcharts from 'highcharts/highstock';
import HighchartsMore from 'highcharts/highcharts-more';
import HighchartsDrilldown from 'highcharts/modules/drilldown';
import Highcharts3D from 'highcharts/highcharts-3d';
import Highmaps from 'highcharts/modules/map';

HighchartsMore(Highcharts)
HighchartsDrilldown(Highcharts);
Highcharts3D(Highcharts);
Highmaps(Highcharts);
new Vue({
  el: '#app',
  router,
  axios,
  components: { App },
  template: &#39;<App/>&#39;,
  methods:{
 
    moreChart() {
        var options = this.getMoreOptions(this.type);
 
        if (this.chart) {
            this.chart.destroy();
        };
    // 初始化 Highcharts 图表
    this.chart = new Highcharts.Chart(&#39;highcharts-more&#39;, options);
    }
  }
})
Nach dem Login kopieren

<template>
    <p class="chart">
        <p :id="id" :option="option"></p>
    </p>
</template>

<script>
import HighCharts from &#39;highcharts&#39;
    export default {
        // 验证类型
        props: {
            id: {
                type: String
            },
            option: {
                type: Object
            }
        },
        mounted() {
            HighCharts.chart(this.id, this.option)
        }
    }
</script>

<style scoped>

</style>
Nach dem Login kopieren

Verwandte Empfehlungen:

? Website

! !

Das obige ist der detaillierte Inhalt vonWie verwende ich Hervorhebungen in Vue? Methodeneinführung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
vue
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage