[Vuejs]-How Show Variable in onchange Method in VueJS?

by

0👍

To access the this of a component inside another scope, (in your case your EXIF callback) just create a new reference to the component’s this in the higher scope and access it inside the callback function.

export default {
  data () {
    return {
      name: '',
      model: ''
    }
  },
  methods: {
    onChange(image) {
      const component = this;

      if (image) {
        EXIF.getData(this.$refs.pictureInput.file, function () {
          var make = EXIF.getTag(this, "Make"),
              model = EXIF.getTag(this, "Model");

          component.make = make;
          component.model = model;
        })
      } else {
        console.log(`it's not image`)
      }
    }
  }
}

Now inside your template:

<template>
  <div>
    <span>Name: {{name}}</span>
    <span>Model: {{model}}</span>
  </div>
</template>

Leave a comment