this.moveImage не является функцией - PullRequest
Новая
       47

this.moveImage не является функцией

0 голосов
/ 19 марта 2019

Я пытаюсь использовать setInterval с моей функцией moveImage, которая меняет положение моего изображения!вот мой код: 

<template>
  <div class="randImg">
    <img v-bind:style="{top: imgTop + 'px', left: imgLeft + 'px',height: imgHeight + 'px', width: imgWidth + 'px'}"
         class="image" v-bind:src="vue">
  </div>
</template>

<script>
  const vue = require("../assets/images/vue.png");
  export default {
    name: "randImg",
    data() {
      return {
        vue,
        imgTop: 0,
        imgLeft: 0,
        imgHeight: 64,
        imgWidth: 64,
        changeInterval: 1000
      }
    },
    created() {
      setInterval(this.moveImage(), this.changeInterval);
    },
    computed: {
      moveImage() {
        this.imgTop = Math.round(Math.random() * (screen.height - this.imgHeight));
        this.imgLeft = Math.round(Math.random() * (screen.width - this.imgWidth));
      }
    }
  }
</script>

, как вы можете видеть, я использую vue.js и получаю сообщение об ошибке «this.moveImage не является функцией», помогите мне, пожалуйста, решить эту проблему!

1 Ответ

2 голосов
/ 19 марта 2019

Это потому, что moveImage не является методом computed property. В качестве вычисляемого свойства vue сгенерирует для него getter.

Вам нужно переместить определение в methods

methods: {
 moveImage() {
    this.imgTop = Math.round(Math.random() * (screen.height - this.imgHeight));
    this.imgLeft = Math.round(Math.random() * (screen.width - this.imgWidth));
  }
}

И при вызове setTimeout вам нужна функция, которая возвращает значение, поэтому вам нужно вызывать ее следующим образом 

created() {
  setInterval(this.moveImage, this.changeInterval);
}
...