我在React中对HOCs有一定程度的了解。我只是有点搞不清楚它们是如何呈现的。假设我有以下几点

export const authenticateUser = WrappedComponent => props => (
  props.authenticated ? <WrappedComponent {...props} /> : <div> Please log in to continue </div>
)

这是我的照片（上图）。我希望有一个HOC，将所有组件封装在其中，如果用户经过身份验证（登录），他们可以查看该屏幕。如果没有，那么我告诉他们登录。非常简单，现在没有什么特别的auth东西。将只是一个道具布尔值，这样我就可以让HOC工作

然后我在苦苦挣扎，我该在哪里调用authenticateUser

我已经把它导入了我的主文件

然后将其分配给一个常量，如下所示：

const auth=authenticateUser（welcomeScreen）

但我仍然不完全清楚如何渲染auth。我试过做{auth}，但似乎不正确。

我也不完全确定我在哪里通过。。。将道具放入包装的组件中。有什么建议吗？