传递给 withAuthenticator HOC 封闭组件的 Props 为空

Question

我期待 props.onStateChange 但 props 是空对象。

传递给 withAuthenticator HOC 的封闭组件的 Props 为空。

import { withAuthenticator } from "@aws-amplify/ui-react";


export const App = withAuthenticator((props) => {
  console.log('props',props) // {}
  return (
    <BrowserRouter>
      ......
    </BrowserRouter>
  );
});

我想要完成的是 sign-out 功能。我试过 Auth.signOut() 。但这只是清除了 localStorage 但没有重定向到 sign-in 页面。

我搜索了这样的问题，发现

When using the Auth.signOut from within the withAuthenticator it will not sign out because it is only updating the session locally in LocalStorage. You need to have a way to rerender the actual withAuthenticator component.

https://github.com/aws-amplify/amplify-js/issues/1529

https://github.com/aws-amplify/amplify-js/issues/4643

提供的解决方案包括使用 props.onStateChange 但我的案例中的道具是空的。

我哪里错了？

Answer 1

经过一些研发我发现

import { withAuthenticator } from "@aws-amplify/ui-react";

此处withAuthenticator HOC不提供任何道具

并且这种方法用于使用预构建的 UI 组件

import { withAuthenticator } from "aws-amplify-react";

这里withAuthenticatorHOC提供道具

• authState
• authData
• onStateChange.

并且这种方法用于定制（创建）我们自己的UI。