Gridsome + AWS扩容-导入事件总线中断注销按钮组件

Question

我已经成功地将AWS扩容的Auth UI功能和组件与Gridsome集成，以实现简单的登录/注销功能，但当我尝试使用

import { AmplifyEventBus } from "aws-amplify-vue"

我知道错误：

Error in mounted hook (Promise/async): "TypeError: Cannot read property 'Logger' of undefined"

我发现了一个类似的问题，论github邮政，并添加了建议

Vue.prototype.$Amplify = Amplify;

确实删除了警告，但是Auth UI Logout组件将不再出现。我可以登录，但是登录按钮没有出现。我不明白为什么访问事件总线会要求我在UI组件已经没有它的情况下向Vue原型添加扩容，以及为什么即使我添加了它，组件仍然不会出现。

Answer 1

AmplifyEventBus已经停止，因此现在被认为是Legacy

相反，请使用Hub.listen，如下所示：

<script>
import { Hub } from 'aws-amplify'

export default {
  mounted() {
    Hub.listen('auth', (info) => {
      console.log('auth event:', info)
    })
  },
}
</script>

还可以以相同的方式导入记录器，例如：

import { Hub, Logger } from 'aws-amplify'