我是 Web 开发的新手,在将前端连接到后端时遇到问题。用于密码重置的 api 有效,并已在 ARC 上进行了测试。但是,当我尝试使用前端时,出现以下错误:
Error: Illegal arguments: undefined, number
at _async (C:\Users\...)
at C:\Users\...
at new Promise (<anonymous>)
at Object.bcrypt.hash (C:\Users\...)
at changePassword (file:///C:/Users/...)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
[nodemon] app crashed - waiting for file changes before starting...
我设置了断点来尝试找出错误发生的位置,发现这是最后一个活动行:
let response = await axios.post('http://localhost:8000/user/password-change', options);
这是完整的代码:
import React, { useState } from 'react';
import axios from 'axios';
import {toast} from 'react-toastify';
import { Button, Grid, Container } from '@material-ui/core';
import useStyles from './styles';
import { TextField} from '@material-ui/core';
const Reset = (props) => {
const [inputComponent,setInputComponent] = useState({
otpCode: '',
newPass: '',
conNewPass: '',
})
const inputHandler = (e) => {
setInputComponent({...inputComponent, [e.target.name]:e.target.value})
}
const changePassword = async () =>{
try{
const data = Object.assign(inputComponent, props);
const options = {
data: data
}
let response = await axios.post('http://localhost:8000/user/password-change', options);
let record = response.data;
if(record.statusText === 'Success'){
toast.success(record.message);
}else{
toast.error(record.message);
}
}catch{
toast.error("Something went wrong");
}
}
const classes = useStyles();
return (
<Container component = "main" maxWidth = "xs">
<form className = {classes.form} >
<Grid container spacing = {2}>
<TextField
name="otpCode"
label="Insert code here"
value= {inputComponent.otpCode}
onChange={inputHandler}
variant="outlined"
required
fullWidth
/>
<TextField
name="newPass"
label="New password"
value= {inputComponent.newPass}
onChange={inputHandler}
variant="outlined"
required
fullWidth
/>
<TextField
name="conNewPass"
label="Confirm new password"
value= {inputComponent.conNewPass}
onChange={inputHandler}
variant="outlined"
required
fullWidth
/>
</Grid>
<Button type = "submit"
fullWidth variant = "contained"
color = "primary"
className = {classes.submit}
onClick={changePassword}
>
Confirm
</Button>
</form>
</Container>
);
}
export default Reset;
如果有什么我需要补充或澄清的,请告诉我。