React Redux Firebase：firebase.auth（...）。signOut（...）。then（...）。error不是函數

Question

將該動作作為動作調用時，這個特定的firebase函數不適用於我。 登錄，編輯用戶名，注冊，所有這些都可以正常工作……除了注銷。

在查看了一些教程和Google自己的文檔之后，我認為該功能將與我實現的所有其他firebase-auth功能一樣工作。

這是我對數據庫的操作：

/* AuthUser.js */
export const login = credentials => {
  return (dispatch, getState, { getFirebase }) => {
    const firebase = getFirebase();

    firebase
      .auth()
      .signInWithEmailAndPassword(credentials.email, credentials.password)
      .then(() => {
        dispatch({ type: LOGIN_SUCCESS });
        dispatch(push('/home'));
      })
      .catch(err => {
        dispatch({ type: LOGIN_FAIL, err });
      });
  };
};

export const logout = () => {
  return (dispatch, getState, { getFirebase }) => {
    const firebase = getFirebase();

    firebase
      .auth()
      .signOut()
      .then(() => {
        dispatch({ type: LOGOUT_SUCCESS });
        dispatch(push('/login'));
      }) /* ERROR POINTS RIGHT AT THIS LINE */
      .error(err => {
        dispatch({ type: LOGOUT_FAIL, err });
      });
  };
};

export const register = user => {
  return (dispatch, getState, { getFirebase }) => {
    const firebase = getFirebase();

    firebase
      .auth()
      .createUserWithEmailAndPassword(user.email, user.password)
      .then(res => {
        return res.user.updateProfile({
          displayName: user.displayName,
        });
      })
      .then(() => {
        dispatch({ type: REGISTER_SUCCESS });
        dispatch(push('/login'));
      })
      .catch(err => {
        dispatch({ type: REGISTER_FAIL, err });
      });
  };
};

export const save = displayName => {
  return (dispatch, getState, { getFirebase }) => {
    const firebase = getFirebase();

    const user = firebase.auth().currentUser;

    if (displayName !== '') {
      user
        .updateProfile({
          displayName,
        })
        .then(() => {
          dispatch({ type: SETTINGS_NAME_CHANGED });
          dispatch(push('/home'));
        })
        .catch(err => {
          dispatch({ type: SETTINGS_ERROR, err });
        });
    } else {
      dispatch({ type: SETTINGS_LEFT_ALONE });
      dispatch(push('/home'));
    }
  };
};

這是我在調用其中一些功能的組件中建立連接的方式。

/* Settings.js */
import React from 'react';
import { /* Some Stuff */ } from 'reactstrap';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';

import 'someStyles.scss';
import { logout, save } from '../store/actions/authUser';

class Settings extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      displayName: '',
    };
  }

  /* This doesn't! */
  onLogout = event => {
    event.preventDefault();
    this.props.logout();
  };

  /* This works! */
  onSubmit = event => {
    event.preventDefault();
    this.props.save(this.state.displayName);
  };

  onChange = event => {
    this.setState({
      [event.target.id]: event.target.value,
    });
  };

  render() {
    const { displayName } = this.state;
    return (
      <Container className=".settingsBody">
        <nav>
          <Nav>
            <NavItem>
              <NavLink href="https://github.com">GitHub</NavLink>
            </NavItem>
            <NavItem>
              <NavLink>
                <div onClick={this.onLogout.bind(this)}>Logout</div>
              </NavLink>
            </NavItem>
          </Nav>
        </nav>
        <Form onSubmit={this.onSubmit.bind(this)}>
          <FormGroup>
            <Label for="displayName">Change Display Name</Label>
            <Input
              type="text"
              name="text"
              id="displayName"
              placeholder={this.props.auth.displayName}
              value={displayName}
              onChange={this.onChange}
            />
          </FormGroup>
          <Button color="primary">Save Settings</Button>
        </Form>
      </Container>
    );
  }
}

Settings.propTypes = {
  logout: PropTypes.func.isRequired,
  save: PropTypes.func.isRequired,
  authError: PropTypes.string,
  auth: PropTypes.object,
};

const mapStateToProps = state => {
  return {
    authError: state.auth.authError,
    auth: state.firebase.auth,
  };
};

const mapDispatchToProps = dispatch => {
  return {
    logout: () => dispatch(logout()),
    save: displayName => dispatch(save(displayName)),
  };
};

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Settings);

React引發此錯誤： TypeError: firebase.auth(...).signOut(...).then(...).error is not a function但是其他函數在運行時會按預期運行。

有什么我想念的嗎？ 該代碼將嘗試導航到我想要的頁面，但在該頁面正確裝入之前引發錯誤。

Answer 1

Promises沒有.error回調，應該是.catch 。

了解有關使用承諾的信息