使用 axios 响应发布请求无法正常工作

Question

I have few data and now i want to save it in database using axios post in react.

I have two fields but in both fields coming same data, dont know whats wrong here.

My Code:

 state = { salonName: '', locationCity: '', }; handleChange = event => { this.setState({ salonName: event.target.value }); this.setState({ locationCity: event.target.value }); }; handleSubmit = event => { event.preventDefault(); const salonData = { salonName: this.state.salonName, locationCity: this.state.locationCity, }; axios({ method: "post", url: "http://localhost:4200/addsalon", headers: {}, data: { salonName: salonData.salonName, locationCity: salonData.locationCity, }, }); } render() { return ( <div> <input type="text" className="form-control" placeholder="Enter Salon Name..." name="salonName" onChange={this.handleChange} /> <input type="text" className="form-control" placeholder="Enter City" name="locationCity" onChange={this.handleChange} /> </div>

but i'm getting same value in database like given below:- {"_id":"60ac7dd4ccfa1c07a8df84d8","salonName":"Delhi","locationCity":"Delhi","__v":0}]

ThankYou for your efforts!

Answer 1

The problem in handle change. you updating both with same if anyone changes

 handleChange = event => {
        if(event.target.name ===='salonName'){
        this.setState({ salonName: event.target.value });
        }else if(event.target.name ===='locationCity'){
        this.setState({ locationCity: event.target.value });
        }
};