我想在给予药物时更新字段。但当我选择drugid为1并点击更新按钮时,它会显示:
'localhost:8081 / drug / 1'未找到。
在mongodb db中也有自动生成的_id列。当我使用邮递员并尝试使用mongo _id进行更新时,它可以正常工作。如何通过我的药物更新它。
UpdateDrugHandler .jsx
'use strict';
import React, { Component } from 'react';
import axios from 'axios';
import UpdateDrugController from '../Controllers/UpdateDrugController';
import PropTypes from 'prop-types';
export default class UpdateDrugHandler extends Component {
// static get propTypes() {
// return {
// user: PropTypes.object
// }
// }
constructor(props) {
super(props);
// this.user = this.props.user;
this.state = {
drugs: []
};
this.updateDrug = this.updateDrug.bind(this);
}
updateDrug(drugid,drugname,drugqty,remark,drugtype,
drugcreatedate,drugdosage,drugcreatedby,drugexpiration,drugprice){
axios.put(`http://localhost:8081/drug/` + drugid ,{
drugid:drugid,
drugname:drugname,
drugqty:drugqty,
remark:remark,
drugtype:drugtype,
drugcreatedate:drugcreatedate,
drugdosage:drugdosage,
drugcreatedby:drugcreatedby,
drugexpiration:drugexpiration,
drugprice:drugprice
}).then(res=>{
console.log(res);
})
}
render() {
return <div>
<UpdateDrugController
updateDrug={this.updateDrug}
/>
</div>
}
}
UpdateDrugController.jsx
'use strict';
import React, {Component} from 'react';
import axios from 'axios';
export default class UpdateDrugController extends Component {
constructor(props) {
super(props);
this.onSubmit = this.onSubmit.bind(this);
this.state = {
users: []
}
this.getAllUsers();
}
onSubmit(event){
event.preventDefault();
this.props.updateDrug(
this.drugid.value,
this.drugname.value,
this.drugqty.value,
this.remark.value,
this.drugtype.value,
this.drugcreatedate.value,
this.drugdosage.value,
this.drugcreatedby.value,
this.drugexpiration.value,
this.drugprice.value,
);
this.drugid.value='';
this.drugname.value='';
this.drugqty.value='';
this.remark.value='';
this.drugtype.value='';
this.drugcreatedate.value='';
this.drugdosage.value='';
this.drugcreatedby.value='';
this.drugexpiration.value='';
this.drugprice.value='';
}
getAllUsers() {
axios.get('http://localhost:8081/drug').then(res => {
this.setState({
users: res.data.data || res.data
});
})
}
render() {
return <div>
<div class="ui grid">
<div class="three column row">
<div class="column"></div>
<div class="ui icon message">
<i class="inbox icon"></i>
<div class="content">
<div class="header">
xxx
</div>
<p>Get the best news in your e-mail every day.</p>
</div>
</div>
<form class="ui tiny form">
<div class="ui compact message">
<p>New Drugs</p>
</div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="DrugID" ref={drugid=>this.drugid=drugid}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Name" ref={drugname=>this.drugname=drugname}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Quantity" ref={drugqty=>this.drugqty=drugqty}/></div>
<div class="field"><label>First Name</label><input maxlength="10" placeholder="Remark" ref={remark=>this.remark=remark}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Type" ref={drugtype=>this.drugtype=drugtype}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Created Date" ref={drugcreatedate=>this.drugcreatedate=drugcreatedate}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Dosage" ref={drugdosage=>this.drugdosage=drugdosage}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Created" ref={drugcreatedby=>this.drugcreatedby=drugcreatedby}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Expiration" ref={drugexpiration=>this.drugexpiration=drugexpiration}/></div>
<div class="field"><label>First Name</label><input maxlength="6" placeholder="Drug Price" ref={drugprice=>this.drugprice=drugprice}/></div>
<div class="field"><label>First Name</label><button class="ui primary button" onClick={this.onSubmit}>Update </button></div>
</form>
<div class="column">ssssssssssss</div>
<div class="column">ssssssssssssssc</div>
</div>
</div>
</div>
}
}