如何在功能组件中定义.this

我正在使用功能组件,目前我从一个基于类的组件中转移了一些代码。原组件的代码是 const { publisherId } = this; 然而,我的功能组件不能使用该功能?我是否需要在功能组件中进行这种检查?

createPublisher() {
    this.publisherId = uuid();
    const { publisherId } = this;

    const publisher = OT.initPublisher(container, properties, (err) => {
      if (publisherId !== this.publisherId) {
        // Either this publisher has been recreated or the
        // component unmounted so don't invoke any callbacks
        return;
      }
    }
}

解决方案:

为什么不干脆这样做,这样更简单,也更有意义。

createPublisher() {
    const publisherId = uuid();

    const publisher = OT.initPublisher(container, properties, (err) => {
      if (publisherId !== this.publisherId) {
        // Either this publisher has been recreated or the
        // component unmounted so don't invoke any callbacks
        return;
      }
    }
}

据W3Schools-

JavaScript中这个关键字指的是它所属的对象,根据使用的位置不同,它有不同的值。

在一个方法中,它指的是所有者对象。在一个方法中,它指的是所有者对象,单独使用时指的是全局对象。在一个函数中,这指的是全局对象。在一个函数中,在严格模式下,这是未定义的。在一个事件中,这指的是接收事件的元素。像call()和apply()这样的方法可以把这个对象引用到任何对象上。

在一个JavaScript函数中,函数的所有者是这个函数的默认绑定。

所以,在一个函数中,这指的是全局对象[对象窗口]。

根据MDN文件:

JavaScript中的每个函数都是一个Function对象。 如果要返回默认值以外的值,函数必须有一个返回语句来指定要返回的值。没有返回语句的函数将返回一个默认值。在用new关键字调用的构造函数的情况下,默认值是其this参数的值。对于所有其他函数,默认的返回值是未定义的。

现在有了箭头函数就没有 this 为该函数本身。你所做的是行不通的,你基本上是将uuid附加到函数的所有者全局对象上,用 publisherId key.在这里,这个函数的所有者是一个函数本身(它是 this 是未定义的,除非使用new关键字调用构造函数,这就是为什么出现错误的原因。An error occurred in an event handler TypeError: Cannot read property 'publisherId' of undefined).如果你叫 createPublisher()new 关键字,它将有自己的这个。我认为你可以直接使用一个变量来代替。这样更合理。

本文来自投稿,不代表实战宝典立场,如若转载,请注明出处:https://www.shizhanbaodian.com/21594.html

(0)
上一篇 1天前
下一篇 1天前

相关推荐

发表评论

登录后才能评论