В настоящее время я работаю над формой мастера в реактивах.У нас есть 4 страницы формы (шаг 1, шаг 2, шаг 3 и шаг 4).Файл Wizard.js
включается на каждом этапе.Я создал логику для них в операторе switch.
Первый шаг успешно продолжается.Когда я нажимаю кнопку «Далее», на шаге 2 ничего не происходит.
Код Wizard.js
this.state = {
current: 1,
};
switch (this.state.current) {
case 0:
// code run for step 1
fetch('..../api/auth/createuser', {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
user: userOject,
}),
})
.then(response => response.json())
.then(createUserRes => {
if (createUserRes.error) {
console.warn(createUserRes);
} else if (createUserRes && createUserRes.user) {
info();
console.warn(createUserRes);
localStorage.setItem(
'user',
JSON.stringify(createUserRes.user),
);
const modifier = {
id: createUserRes.user._id,
type: createUserRes.user.profile.type,
profile: {
fullName: values.fullName,
position: values.lastPosition,
username: values.username,
location: values.lastPosition,
company: values.lastCompany,
photo: '',
screen: 'Step1',
},
};
fetch(`...../api/auth/user/update`, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
id: createUserRes.user._id,
modifier,
}),
})
.then(response => response.json())
.then(res => {
if (res.error) {
console.warn(res);
} else {
console.warn(res);
this.next();
}
})
.done();
}
});
break;
case 1:
// code run for step 2
this.handleUpload = e => {
const reader = new FileReader();
const storeUser = JSON.parse(localStorage.getItem('user'));
reader.onload = function(upload) {
fetch(`....../api/s3/uploadtoaws`, {
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
method: 'POST',
body: JSON.stringify({
userId: storeUser._id,
type: 'employee',
content: upload.target.result,
key: 'e.file.name',
oldKey: '',
}),
})
.then(response => response.json())
.then(res => {
console.warn(res);
this.next();
})
.done();
};
reader.readAsDataURL(e.file.originFileObj);
};
break;
case 2:
// code run for step 3
break;
case 3:
// code run for step 4
fetch(`...../api/auth/user/updateskills`, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
id: user._id,
type: user.profile.type,
modifier: {
'profile.skills': values.skills,
},
}),
})
.then(response => response.json())
.then(res => {
if (res.error) {
console.warn(res);
} else {
console.warn(res);
// this.afterDone();
this.next();
}
})
.done();
break;
default:
}
Код Step2
<Form onSubmit={this.handleSubmit}>
<FormItem>
{getFieldDecorator('picture', {
rules: [
{
required: true,
message: 'Please upload picture!',
},
],
})(
<Upload onChange={this.handleUpload}>
<Button>
<Icon type="upload"/>
Click to Upload
</Button>
</Upload>
,
)}
</FormItem>