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

Promise没有.error回调，应为.catch。

了解有关Using Promises

的信息

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

1 个答案: