0

我是 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;

如果有什么我需要补充或澄清的,请告诉我。

4

0 回答 0