vuemounted（）中的setInterval函数不起作用答案

【问题标题】：setInterval function in vue mounted() not workingvuemounted（）中的setInterval函数不起作用
【发布时间】：2020-01-17 18:17:57
【问题描述】：

我的函数工作正常，但 setInterval 不起作用，我希望我的 h1 的 text-shadow 被随机化（已经编写了该函数）并使用 setInterval() 每 1000 毫秒更改一次，但它似乎不起作用

代码如下：

  data(){
      return {
        textshadow: '1.3px 2px 0',
        textshadowColor: '#333'
      }
  },
  methods:{
    playy:function(){
      var test = '#'+Math.floor(Math.random()*16777215).toString(16);
      this.textshadowColor = test;
    }
  },
  mounted(){
    setInterval(this.playy(),1000);
  }

  <div class="main">
      <h1 v-bind:style="{textShadow : '1.3px 2px 0' + textshadowColor}">{{ title }}</h1>
  </div>

h1 {
  text-align:center;
  padding-top:22px;
  color:#fff;
  text-shadow:1.3px 2px 0;
  cursor: nesw-resize;
  transition: .2s;
}

【问题讨论】：

你确定mounted()被调用了吗？
@JDunken 我不明白你的问题
如果从未调用过mounted()，则间隔将永远不会开始。我现在猜测它是 vue 调用自己的函数。你有没有把console.log放在那里确定？哦，@Deykun 在他们的回答中说了什么。

标签： javascript html css vue.js

【解决方案1】：

尝试传递this.playy 而不是this.playy() setInterval 期望函数的引用。

setInterval(this.playy,1000);

【讨论】：

这是正确的。如果您传递this.playy()，则您传递的是由playy 函数返回的值，在本例中为undefined。这意味着，setInterval 将尝试调用 undefined 而不是您的函数。通过传递this.playy（无调用），您传递的是对函数本身的引用。