Я пытаюсь обновить детали пользователя, но я не совсем понимаю, как использовать запрос put
во внешнем интерфейсе. Я создаю одно веб-приложение, вот мой код, может ли кто-нибудь помочь мне с этим
import React from 'react';
import axios from 'axios';
export default class UpdateUser extends React.Component {
constructor(props) {
super(props);
this.state = {
id: "",
fullName: "",
Email: "",
Phonenumber: "",
service: { service: "options" },
Description: "",
show : false
};
}
componentDidMount() {
const userId = +this.props.match.params.id;
if(userId) {
this.findUserById(userId);
}
}
findUserById = (userId) => {
axios.get("https://localhost:44338/api/publicInfo/"+userId)
.then(response => {
if(response.data != null) {
this.setState({
id:response.data.id,
fullName:response.data.fullName,
Phonenumber:response.data.Phonenumber,
service:response.data.service,
Description:response.data.Description,
});
}
}).catch((error) => {
console.error("Error - "+error);
});
};
updateUser = event => {
event.preventDefault();
const user = {
id:this.state.id,
fullName:this.state.fullName,
Phonenumber:this.state.Phonenumber,
service:this.state.service,
Description:this.state.Description,
};
axios.put("https://localhost:44338/api/publicInfo/", user)
.then(response => {
if(response.data != null) {
this.props.history.push("/admin");
} else {
this.setState({"show":false});
}
});
};
userChange = event => {
this.setState({
[event.target.name]:event.target.value
});
};
render() {
const {fullName, Email, Phonenumber,service, Description} = this.state;
return (
<div>
<h3>
{<strong>Edit User Information</strong>}
</h3>
<div className="pwrapper">
<div className="form_wrapper">
<h1 className="feedTitle">
{"Update user details "}
</h1>
<form>
<div className="fullName">
<lable htmlFor="fullName">Full Name</lable>
<input
placeholder="fullName"
type="text"
name="fullName"
value={fullName}
onChange={this.userChange}
noValidate
/>
</div>
<div className="email">
<lable htmlFor="email">Email</lable>
<input
placeholder="example.someone@gmail.com"
type="email"
name="email"
value={Email}
onChange={this.userChange}
noValidate
/>
</div>
<div className="Phonenumber">
<label htmlFor="Phonenumber">Phone Number</label>
<input
type="text"
placeholder="XXX-XXX-XXXX"
className="form-control"
name="userName"
value={Phonenumber}
onChange={this.userChange}
/>
</div>
<div className="services">
<label htmlFor="service">Service</label>
<select value={service} onChange={this.userChange}>
<option name="options"> Choose one of your skill</option>
<option name="Plumbing Service"> Plumbing Service</option>
<option name="Moving Service">Moving Service</option>
<option name="Electrician"> Electrician</option>
<option name="Landscaping">Landscaping</option>
<option name="House Remodeling"> House Remodeling</option>
<option name="Canvas & pencil Art">
Canvas & pencil Art
</option>
<option name="Animatorse"> Animators</option>
<option name="Photography">Photography</option>
<option name="Logo Design">Logo Design</option>
</select>
</div>
<div className="description">
<lable htmlFor="suggestion">
Say few words that define you :
</lable>
<textarea
cols="20"
rows="6"
className="form-control"
id="message"
placeholder="It is like your resume.... "
value={Description}
onChange={this.userChange}
noValidate
></textarea>
</div>
<div className="createAccount">
<button type="submit" onClick={this.updateUser}>
{"Update"}
</button>
</div>
</form>
</div>
</div>
</div>
);
}
}
, когда я пытаюсь реализовать запрос put
с приведенным выше кодом, он показывает ошибку.