如何將Firebaseui auth與Redux集成

Question

我有一個使用firebaseui設置的工作auth配置。 我有一個私人登錄頁面，我想將用戶重定向到，但我不知道如何將憑證響應傳遞到我的redux商店。

我基本上想從我的signInSuccess回調調用我的Home組件的handleClickLogin方法（當前掛鈎到一個虛擬按鈕）。 換句話說，我正在嘗試dispatch(login()); 當我成功登錄時，它會將標志添加到我的redux商店，然后我可以用它來訪問我的私人登錄頁面。 由於firebase.js是不是在組件樹，我沒有獲得dispatch這里，所以我如何才能在掛接到我店里的反應？

firebase.js

const uiConfig = ({
  // signInSuccessUrl: '/',
  signInOptions: [
    firebase.auth.EmailAuthProvider.PROVIDER_ID,
    ],
    callbacks: {
        signInSuccess: (resp) => <<<???>>>,
    },
});

firebase.initializeApp(config);
const ui = new firebaseui.auth.AuthUI(firebase.auth());

export const startFirebaseUI = elementId => {
  ui.start(elementId, uiConfig);
};

Home.jsx （剝離）

export class Home extends React.PureComponent {
  static propTypes = {
    dispatch: PropTypes.func.isRequired,
    user: PropTypes.object.isRequired,
  };

  componentDidMount = () => {
    startFirebaseUI('#firebaseui-auth-container');
  }

  handleClickLogin = () => {
    const { dispatch } = this.props;

    dispatch(login());
  };

  render() {
    const { user } = this.props;

    return (
      <Background>
        <HomeContainer>
          <Button
            onClick={this.handleClickLogin}
          >
            <Text ml={2}>Start</Text>
          </Button>
          <div id="firebaseui-auth-container" />
        </HomeContainer>
      </Background>
    );
  }
}

function mapStateToProps(state) {
  return { user: state.user };
}

export default connect(mapStateToProps)(Home);

Answer 1

以某種方式輸入問題幫助我弄明白了。 只需要導入商店和相應的操作，然后直接發送。

import { store } from 'store/index';
import { login } from 'actions/index';

callbacks: {
    signInSuccess: (resp) => store.dispatch(login(resp)),
}