在reactjs中包装第三方js库

您正在讨论的代码如下:

class ... {
   ...

   wrapper;
   instance;

   ...
}

这只是一个没有给出值的属性声明,它与:

class ... {
   ...

   wrapper = undefined;
   instance = undefined;

   ...
}

如果你把它完全去掉,什么都不会发生。如果你多检查代码, wrapper 存储包装的dom引用 <div> 我是说, instance 存储的braintree实例来自 componentDidMount 是的。

eslint规则有可能强制执行声明。

如何包装第三方库?

关于这个话题有很多资源。您可以从第一个官方react文档开始- Integrating with Other Libraries 是的。

此外,已经创建了react包装器/集成,以及您要求的库:

1. google-maps-react - 使用react的声明性google map-react组件 是的。图书馆也有 complete article how it works 是的。
2. braintree-dropin-react - 在ui(v3)中集成braintree drop的react组件 是的。

你提到的代码的目的是什么?

只是一个 property declaration 是的。我想是为了清楚起见,不管有没有 wrapper, instance 声明,代码仍将以相同的方式运行。