我对react-redux还是陌生的，正在尝试实现一种形式，使用户可以更新其个人资料中的信息，并且在分配动作方面遇到问题。
我已经在api文件中创建了一个常量，动作，缩减器并指定了Update Account路径，但是每次单击There was an error时，我都会收到const EditProfile = () => {
const [formData, setFormData] = useState({});
const [form] = Form.useForm();
const { user } = useSelector((state) => state.user);
const dispatch = useDispatch();
useEffect(() => {
if (user) {
const userData = { ...initialValues };
for (const key in user) {
if (key in userData) userData[key] = user[key];
}
setFormData(userData);
}
form.setFieldsValue({
firstName: formData.firstName,
lastName: formData.lastName,
email: formData.email,
phone: formData.phone,
gender: formData.gender,
maritalStatus: formData.maritalStatus,
educationLevel: formData.educationLevel,
income: formData.income,
});
}, [
user,
form,
formData.firstName,
formData.lastName,
formData.email,
formData.phone,
formData.gender,
formData.maritalStatus,
formData.educationLevel,
formData.income,
]);
const initialValues = {
firstName: null,
lastName: null,
email: null,
phone: null,
gender: null,
maritalStatus: null,
educationLevel: null,
income: null,
};
const onSubmit = (values) => {
dispatch(attemptUpdateUser(values)).catch((error) => {
if (error.response) {
return notification[`error`]({
message: `Uh-oh!`,
description: `${error.response.data.message}`,
});
}
});
};
return (
<div>
<Form
form={form}
layout="vertical"
name="update-user"
initialValues={initialValues}
onFinish={onSubmit}
>
<Row>
<Col xs={24} sm={24} md={24} lg={16}>
<Row gutter={ROW_GUTTER}>
<Col xs={24} sm={24} md={12}>
<Form.Item
label="First Name"
name="firstName"
rules={[
{
required: true,
message: 'First Name is required',
},
]}
>
<Input placeholder="Enter your First Name" />
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item
label="Last Name"
name="lastName"
rules={[
{
required: true,
message: 'Last Name is required',
},
]}
>
<Input placeholder="Enter your Last Name" />
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item
label="Email Address"
name="email"
rules={[
{
required: true,
type: 'email',
},
]}
>
<Input placeholder="Enter your Email Address" disabled />
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item label="Phone Number" name="phone">
<Input placeholder="Enter your Phone Number" maxLength="10" />
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item name="gender" label="Gender">
<Select placeholder="Select a Gender">
<Option value="MALE">Male</Option>
<Option value="FEMALE">Female</Option>
</Select>
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item name="maritalStatus" label="Marital Status">
<Select placeholder="Select Marital Status">
<Option value="SINGLE">Single</Option>
<Option value="MARRIED">Married</Option>
<Option value="LIVING_TOGETHER">Living Together</Option>
<Option value="DIVORCED">No Longer Married</Option>
</Select>
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item name="educationLevel" label="Education Level">
<Select placeholder="Select Education Level">
<Option value="SOME_HIGH_SCHOOL">
Some High School or Less
</Option>
<Option value="HIGH_SCHOOL">
High school graduate or equivalent (GED)
</Option>
<Option value="SOME_COLLEGE">
Some college, no degree
</Option>
<Option value="COLLEGE">College graduate</Option>
<Option value="SOME_GRADUATE_SCHOOL">
Graduate school, no degree
</Option>
<Option value="ASSOCIATE_DEGREE">Associate degree</Option>
<Option value="GRADUATE_SCHOOL">Masters degree</Option>
<Option value="PROFESSIONAL_DEGREE">
Professional Degree
</Option>
<Option value="DOCTORATE">Doctorate</Option>
<Option value="COLLEGE_DIPLOMA">College Diploma</Option>
<Option value="TRADE_SCHOOL">
Some college, no diploma
</Option>
</Select>
</Form.Item>
</Col>
<Col xs={24} sm={24} md={12}>
<Form.Item name="income" label="Income">
<Select placeholder="Select Income">
<Option value="LESS_THAN_$25000">Less than $25,000</Option>
<Option value="$25000_$49999">$25,000 - $49,999</Option>
<Option value="$50000_$74999">$50,000 - $74,999</Option>
<Option value="$75000_$99999">$75,000 - $99,999</Option>
<Option value="$100000_$149999">$100,000 - $149,999</Option>
<Option value="$150000+">$150,000+</Option>
</Select>
</Form.Item>
</Col>
</Row>
<Button type="primary" htmlType="submit">
Update Account
</Button>
</Col>
</Row>
</Form>
</div>
);
};
控制台。
任何帮助/提示都将不胜感激！
EditProfile.js
const updateUser = (user) => http.post('/user', user);
api / index.js
export function updateUser(user) {
return {
type: UPDATE_USER,
user,
};
}
redux / actions / User.js
const initialState = {
isAuth: false,
user: null,
};
export default function user(state = initialState, action) {
switch (action.type) {
case LOGIN_USER:
case SET_USER:
return {
...state,
user: action.user,
isAuth: true,
};
case UPDATE_USER:
return {
...state,
user: action.user,
};
case LOGOUT_USER:
return {
isAuth: false,
user: null,
};
case RESET_USER:
return initialState;
default:
return state;
}
}
redux / reducers / User.js
export const attemptUpdateUser = (updatedUser) => async (dispatch) => {
await updateUser(updatedUser).catch(console.log('There was an error'));
};
redux / thunks / user.js
Process[] runningProcess = Process.GetProcessesByName("dllhost");
if(runningProcess.Length > 0 )
{
foreach (var surrogateProcess in runningProcess)
{
surrogateProcess.Kill();
}
}