未处理的拒绝(typeerror):寄存器不是函数

9bfwbjaz  于 2021-09-23  发布在  Java
关注(0)|答案(0)|浏览(212)

启动onsubmit时获取寄存器的此错误。在过去的几天里,我一直在试着调试它,甚至还做了第二次眼睛检查,但没有成功。
到目前为止,我尝试过的解决方案包括检查寄存器是否正确导出,检查解构是否正确处理,以及是否使用正确的语法调用函数。每一个问题似乎都得到了验证,这让我感到困惑,不知道如何解决这个问题。
控制台错误:

Uncaught (in promise) TypeError: register is not a function
    onSubmit Register.js:30
    onSubmit Register.js:39

设立登记册:

import axios from 'axios'
import { setAlert } from './alert'
import {
  REGISTER_SUCCESS,
  REGISTER_FAIL,
} from './types'

// Register user
export const register = ({ name, email, password }) => async dispatch => {
  const config = {
    headers: {
      'Content-Type': 'application/json'
    }
  }

  const body = JSON.stringify({ name, email, password })

  try {
    const res = await axios.post('/u', body, config)

    dispatch({
      type: REGISTER_SUCCESS,
      payload: res.data
    })

    // dispatch(loadUser())
  } catch (err) {
    const errors = err.response.data.errors

    if (errors) {
      errors.forEach(error => dispatch(setAlert(error.msg, 'danger')))
    }

    dispatch({
      type: REGISTER_FAIL
    })
  }
}

登记表格:

import { connect } from 'react-redux'
import axios from 'axios'
import { Container, Form, Col, Row, Button } from 'react-bootstrap'
import { Link } from 'react-router-dom'
import { setAlert } from '../actions/alert'
import { register } from '../actions/auth'
import PropTypes from 'prop-types'

export const Register = ({ setAlert, register }) => {

  const [ formData, setFormData ] = useState({
    firstName: '',
    lastName: '',
    username: '',
    email: '',
    password: '',
    password2: ''
  })

  const { firstName, lastName, email, username, password, password2 } = formData

  const onChange = e => setFormData({ ...formData, [ e.target.name ]: e.target.value })

  const onSubmit = async e => {
    e.preventDefault()
    if (password !== password2) {
      setAlert('Passwords do not match', 'danger')
    } else {
      register({ firstName, lastName, username, email, password })
    }
  }

  return (
    <>
      <h4 className="text-center my-3">Create account</h4>
      <Container className="d-flex mx-auto justify-content-center bottomPaddingGap">
        <Row className="d-flex flex-column">
          <Form onSubmit={e => onSubmit(e)}>
            <Row>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>First name</Form.Label>
                  <Form.Control
                    required
                    type="text"
                    name="firstName"
                    placeholder="John"
                    value={firstName}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>Last name</Form.Label>
                  <Form.Control
                    required
                    type="text"
                    name="lastName"
                    placeholder="Doe"
                    value={lastName}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
            </Row>
            <Row>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>Email</Form.Label>
                  <Form.Control
                    required
                    type="email"
                    name="email"
                    value={email}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>Username</Form.Label>
                  <Form.Control
                    required
                    type="text"
                    name="username"
                    placeholder="@"
                    value={username}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
            </Row>
            <Row>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>Password</Form.Label>
                  <Form.Control
                    required
                    type="password"
                    name="password"
                    minLength="6"
                    value={password}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
              <Col md="auto">
                <Form.Group className="mt-3">
                  <Form.Label>Confirm password</Form.Label>
                  <Form.Control
                    required
                    type="password"
                    name="password2"
                    minLength="6"
                    value={password2}
                    onChange={e => onChange(e)}
                  />
                </Form.Group>
              </Col>
            </Row>
            <Form.Group className="mt-3">
              <Form.Control
                type="submit"
                value="Create your account"
                className="btn btn-primary"
              />
            </Form.Group>
          </Form>
          <div className="text-center mt-3 border-top">
            <p className="text-muted pt-3 mb-1">Already have an account?</p>
            <Link to="/login" className="noDecor">
              <div className="d-grid gap-2">
                <Button variant="secondary">Log In</Button>
              </div>
            </Link>
          </div>
        </Row>
      </Container>
    </>
  )
}

Register.propTypes = {
  setAlert: PropTypes.func.isRequired,
  register: PropTypes.func.isRequired
}

export default connect(null, { setAlert, register })(Register)```

  [1]: https://i.stack.imgur.com/5bGce.png

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题