webentwicklung-frage-antwort-db.com.de

Führen Sie die Komponentenmethode unter load vue.js aus

hey, ich bin ziemlich neu bei Vue.js und versuche, eine scheinbar einfache Sache zu schaffen, aber ich habe Probleme. Im Wesentlichen brauche ich es also, jedes Mal wenn eine Komponente in das DOM geladen wird, wird eine ihrer Methoden ausgelöst. Hier ist mein aktueller Code, ich habe versucht, v-on zu verwenden: load, aber es scheint nicht zu funktionieren.

Vue.component('graph', {
    props:['graphId','graphData'],
    template: '<canvas v-on:load="{{populateGraph()}}"></canvas>',
    methods: {
        initGraph: function () {
            var settlementBalanceBarChart = new Chart(this.graphId, {
                type: "bar",
                data: settlementBalanceBarData,
                options: settlementBalanceBarOptions
            });
        },
        //this is the function I would like to run
        populateGraph: function () {
            alert('{{graphId}}');
        }
    }

});

var vm = new Vue({
    el: "#app",
    mounted: function(){

    }

});

Der gleiche Code funktioniert gut, wenn ich das v-on: click -Ereignis verwende

16
Zak A

Es gibt Instanz-Lebenszyklus-Hooks , die Sie dafür verwenden können. Zum Beispiel:

Vue.component('graph', {
    props:['graphId','graphData'],
    template: '<canvas></canvas>',
    created: function () {
        alert('{{graphId}}');
    },
    methods: {}
});
21
str

Sie müssen die Funktion mit dem Präfix "this" wie folgt aufrufen:

var data =
{
   cashiers: []
}

var vm = new Vue({
    el: '#app',
    data: data,
    created: function () {
       this.getCashiers();
    },
    methods: {
         getCashiers: function () {
          vm.cashiers = [];
         }
    }

});
0
Mohammed Osman