[Vuejs]-Reference prop from callback

by

2👍

✅

If you want to use this in your data you have to use a normal function so that the this keyword could be correctly bound to the Vue instance ..


export default {
    props: {
        test: {
            type: String,
            required: true,
        },
    },
    data() {
        const vm = this
        return {
            chartOptions: {
                tooltips: {
                    callbacks: {
                        label: function(tooltipItem, data) {
                            console.log(vm.test);
                            return '';
                        }
                    }
                }
            }
        }
    }
}
👤Husam Ibrahim

1👍

Try to use an arrow function and define chartOptions as a computed property :

computed:{
  chartOptions(){
    return {
      tooltips: {
         callbacks: {
        label: (tooltipItem, data)=> {
            console.log(this.test);
            return '';
        }
      }
    }
  }
}

}
👤Boussadjra Brahim

Leave a comment