[Vuejs]-Laravel & Vue.js. I Can't Fix My Code

0👍

There are some syntax errors that need to be fixed first.

  • There’s an extra ")" at the end of your created method
  • The methods property is missing a closing "}"
  • There’s a missing ")" at the very end to match the opening new Vue( parenthesis.

It’s helpful to indent your code to make these things easier to spot.

Then, you’ll need to update your data to be a function that returns an object. See Vue Docs – Data Must Be a Function

You also have some typos for the "response" variable.

Lastly, in your HTML you have two divs that have id="app".

Your JS should look something like:

var app = new Vue({
    el: '#app',
    data: {
        message: '',
        infos: [],
        info: {
            id: 0,
            cv_id: window.Laravel.idExperience,
            titre: '',
            body: '',
        }
    },
    methods: {
        getExperiences: function () {
            axios.get(window.Laravel.url + '/getexperiences/' + window.Laravel.idExperience)
                .then(response => {
                    console.log(reponse.data);
                    this.info = response.data;
                })
                .catch(error => {
                    console.log('errors: ', error);
                })
        },
        addExperience: function () {
            axios.post(window.Laravel.url + '/addexperience', this.info)
                .then(response => {
                    if (response.data.etat) {

                        this.infos.unshift(this.info);
                        this.info = {
                            id: 0,
                            cv_id: window.Laravel.idExperience,
                            titre: '',
                            body: '',
                        };
                    }
                })
                .catch(error => {
                    console.log('errors: ', error)
                })
        },
        created: function () {
            this.getExperiences();
        }
    }
});

Let me know if that works for you.

Leave a comment