[Vuejs]-VueJS : Trigger function to fill up a select at the loading of the form

0👍

There is no mounted event, it is a lifecycle method. I don’t know where the trigger object is in your code, maybe it is computed data? but anyway make sure you have access to it in this template. Also you shall init the conexion param in your local data in order to use it in template. init it to an empty object. The array mailchimp_lists is always true, check mailchimp_lists.length. Hope this will help

0👍

You have two misconceptions about mounted:

  • It’s not an event. It’s a lifecycle hook, it is executed as part of the lifecycle of your component.
  • It isn’t fired once at page load. It’s fired for any Vue component whenever it is mounted (that is, rendered and ready to function). So it will run every time your component is mounted, and if you destroy your component by using v-if then it will run again when it’s recreated.

As an example of my second point, you can check out this fiddle.

To add the mounted hook to your component simply add it to your component’s declaring object like this:

data() {
    return {
        mailchimp_lists : [],
        errors : {}
    };
},
methods: {
    getMailchimpLists(connexionId){
        axios.get('/api/mailchimp/lists?connexion_id='+connexionId)
        .then(result => {
            this.mailchimp_lists = result.data;
        })
        .catch(error => {
            this.errors = error;
        });
    }
},
mounted: function() {
    // Your code goes here
}

Leave a comment