如何在VueJS中的window.onpopstate中使用变量

Question

我有一个Vue组件，如下所示：

Test.vue

private input: string = "";
private pageNumber: number = 0;

mounted() {
    window.onpopstate = function() {
      this.input = "test";
      this.pageNumber = 1;
    }
    this.init({ page: this.page, input: this.input }); // reset search state when mounted
  }

但是如果我将this.input = "test"放在window.onpopstate函数中，它将以Property 'input' does not exist on type 'WindowEventHandlers'.记录

那么如何在this.input函数中为window.onpopstate赋值？

谢谢！

Answer 1

您正在使用function关键字创建函数。这意味着您的this可以更改。像window.onpopstate这样的窗口事件总是将this设置为窗口。这意味着您正在input上设置pageNumber和window。要解决此问题，您可以使用箭头功能。

window.onpopstate = () => {
  this.input = "test";
  this.pageNumber = 1;
}