Vuejs - 输入时,运行一个函数(但有一个延迟)

Mon*_*ock 6 javascript vue.js vuejs2

我有一个输入字段,v-on:input它运行一个名为的方法activate,如下所示:

export default: {
    data() {
        return {
            isHidden: true
        }
    },
    methods: {
        activate() {
            this.isHidden = false;
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

isHidden 打开/关闭一些图标(这个数据属性是什么并不重要;我只是出于示例目的使用它).

所以目前,当用户执行此操作时,input它会立即打开该activate功能.有没有办法让它延迟通过setTimeout?我尝试过以下操作,但它不起作用:

methods: {
    setTimeout(function() {
        activate() {
            this.isHidden = false;
        }
    }, 500)
}
Run Code Online (Sandbox Code Playgroud)

Joe*_*rdi 21

试试这个:

methods: {
  activate() {
    setTimeout(() => this.isHidden = false, 500);
  }
}
Run Code Online (Sandbox Code Playgroud)


les*_*kin 10

或者没有箭头功能:

methods: {
    activate() {
        var that = this;
        setTimeout(function() { that.isHidden = false; }, 500);
    }
}
Run Code Online (Sandbox Code Playgroud)

  • @Besi 这就是为什么它被分配给“that”。 (6认同)
  • 不,如果没有箭头函数,您将丢失 this.isHidden 的上下文 (4认同)