<Modal wrapClassName='hx-modal-wrap' width='6rem' visible={visible} destroyOnClose // onCancel={onCancel} // onOk={onOk} keyboard={false} maskClosable={false} closable={false} title='修改密码' > <Form form={form} // initialValues={editData} layout='horizontal' colon={false} onFinish={onFinish} > <Form.Item label='原始密码' name='oldPassword' rules={[{ required: true },{ validator: validateOldRules }]} labelCol={{style:{width:110}}} labelAlign='right'
> <Input.Password placeholder='请输入密码'/> </Form.Item> {oldImgUrl && }
<Form.Item label='新密码' name='newPassword' labelCol={{style:{width:110}}} labelAlign='right' // validateStatus={getFieldError('newPassword') ? 'error' : ''} rules={[ { required: true }, { validator: validateRules } ]} > <Input.Password placeholder='请输入密码,8位以上数字+字母组合'/> </Form.Item> {newImgUrl && } <Form.Item label='确认新密码' name='confirmPassword' dependencies={['newPassword']} labelCol={{style:{width:110}}} labelAlign='right' rules={[ { required: true }, { validator: validateConfirmRules } ]}> <Input.Password placeholder='请输入密码,8位以上数字+字母组合'/> </Form.Item> {confirmImgUrl && } const onFinish = (values) => { console.log(values,'111'); // form.validateFields().then((values) => { // console.log(values,'lll'); // setConfirmLoading(true); // firePostJsonRequest(AUTH_CHANGE_PASSWORD, values).then((res) => { // setConfirmLoading(false); // if (res.code !== 200) { // openNotification('error', '修改密码失败', res.message); // return; // } // showSuccessMsg('修改密码成功,请用新密码重新登录!'); // onCancel(); // appStore.logout(() => { // window.location.href = '/account/login'; // }); // }); // }); } 在代码中,onFinish方法没有被调用,所以无法打印出values。您可以在Form组件的onFinish属性中调用onFinish方法,例如:

<Form
    form={form}
    layout={'horizontal'}
    colon={false}
    onFinish={(values) => onFinish(values)}
>

或者直接在Form组件的onFinish属性中传递onFinish方法,例如:

<Form
    form={form}
    layout={'horizontal'}
    colon={false}
    onFinish={onFinish}
>

这样就可以在onFinish方法中打印出values了。

修改密码弹窗组件代码示例

原文地址: http://www.cveoy.top/t/topic/2UA 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录