启动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
暂无答案!
目前还没有任何答案,快来回答吧!