title: issue with sprite.events.onInputDown.add() with Vue.js
body: <p>I am a new web dev and is currently working with Vue.js framework.
  Decided to try out making a game with Phaser 2, and I am currently loving it!
  Although i ran in to some problems with mouse events, i have no problems with key down events ;)</p>
  
  <p>currently I am trying to click on an image, just to console log it out. (will want to drag later on.)
  but first thing is first, I cant even get my console log out. 
  here is my code, and I am using it with vue.js!
  Any help will be great ! Thank you! </p>
  
  <p>Below are some snippets of my code that i think will be important </p>
  
  <pre><code>mounted () {
    let self = this
    if (this.game == null) {
      this.game = new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.AUTO, this.$el, {
        preload: function preload () {
          self.preload(this)
        },
        create: function create () {
          self.create(this)
        },
        update: function update () {
          self.update(this)
        },
        render: function redner () {
          self.render(this)
        }
      })
    }
  }
  preload () {
    this.game.load.image('pink', require(`@/assets/images/packing/pink-bg.png`))
    this.game.load.image('cat', require(`@/assets/images/packing/cat-head.png`))
    this.game.load.image('table', require(`@/assets/images/packing/table.png`))
    this.game.load.image('plate', require(`@/assets/images/packing/plate.png`))
    this.game.load.spritesheet('container', require(`@/assets/images/packing/container-set.png`), 310, 270)
    this.game.load.spritesheet('scorePlate', require(`@/assets/images/packing/kueh-set.png`), 313, 270)
  }
  let cat = this.game.add.sprite(0, 0, 'cat')
  cat.height = this.game.world.height * 0.25
  cat.width = this.game.world.width * 0.15
  
  let table = this.game.add.sprite(0, 0, 'table')
  table.height = this.game.height
  table.width = this.game.width
  
  this.game.physics.startSystem(Phaser.Physics.ARCADE)
  
  let containerBullu = this.game.add.sprite(this.game.world.width - (this.game.world.centerX + this.game.world.centerX), this.game.world.height / 7, 'container')
  containerBullu.height = this.game.world.height * 0.55
  containerBullu.width = this.game.world.width * 0.35
  containerBullu.frame = 4
  containerBullu.inputEnabled = true
  containerBullu.events.onInputDown.add(this.listener, containerBullu)
  
  let containerCornflake = this.game.add.sprite(this.game.world.width - (this.game.world.centerX + this.game.world.centerX / 1.8), -50, 'container')
  containerCornflake.height = this.game.world.height * 0.6
  containerCornflake.width = this.game.world.width * 0.35
  containerCornflake.frame = 9
  render (phaser) {
    this.game.debug.spriteInfo(this.containerBullu, 100, 100)
  }
  listener (containerBullu) {
    console.log(containerBullu)
  },
  destroyed () {
    this.game.destroy()
  }
  </code></pre>
  
  <p>I hope to hear from anyone soon!
  Thanks!</p>
  
  <p>sincerely,
  desperate and crying new front end web developer. (I was on it for 4hours. as of now. still going... )</p>