Intellij WebStorm 在封装的 React 组件上显示无用的使用搜索（使用 HOC）答案

【问题标题】：Intellij WebStorm showing useless usage search on encapsulated React components (using HOC)Intellij WebStorm 在封装的 React 组件上显示无用的使用搜索（使用 HOC）
【发布时间】：2020-09-09 20:07:52
【问题描述】：

基本上是this issue。

在使用类似代码时

class SomeComponent extends React.Component {

}

export default withRouter(SomeComponent);

我无法正确使用搜索，因为它显然找到了导出行。

它可以在这样的功能组件中被黑客入侵：

const SomeComponent = withRouter((props) => {
   //...component here
});
export default SomeComponent;

但是在使用 redux 时会变得很丑：

const mapStateToProps = (state, ownProps) => ({
    ....
});

const SomeComponent = connect(mapStateToProps)({
    cartPhotos,
    digitals,
    balancePrice,
    photolabPrice,
    digitalsPrice,
    voucher,
    photosPrice,
    deliveryPrice,
    totalPrice,
    openPhotolabModal,
    isSidebar,
}) => {

});
export default SomeComponent;

我的问题是：

有没有办法在不使用这种丑陋方法的情况下克服这个问题？
有没有办法在类组件上完全克服这个问题？

【问题讨论】：

我无法提供任何解决方法，抱歉。请关注youtrack.jetbrains.com/issue/WEB-41501 获取更新
感谢@lena 的尝试，但您确实复制了我已经在我的问题中发布的链接。无论如何，我认为它应该有更高的优先级，因为它有点烦人并且现在持续很长时间。 :(

标签： javascript reactjs intellij-idea react-redux ide

【解决方案1】：

您只能找到 SomeComponent 的一个 ref 是正常的。

SomeComponent !== 您的默认导出

如果你按右键点击默认并在那里搜索你会发现所有在导入中使用它的用法。

【讨论】：

我也同意这可能不是一个错误，而是一个非常常见的边缘情况，如果还没有这个技巧，应该以某种方式解决:-)