reactjs – 如何编辑反应引导表并在编辑后保存数据
发布时间:2020-12-15 20:30:00 所属栏目:百科 来源:网络整理
导读:如何直接在浏览器页面上编辑表格并在重新加载页面后保存数据.该表是使用react bootstrap table.screenshot of project is here. edit and save like in screenshot 我的项目代码在这里. onAfterSaveCell(value,name){axios({method:'post',url:'https://some
如何直接在浏览器页面上编辑表格并在重新加载页面后保存数据.该表是使用react bootstrap table.screenshot of project is here.
edit and save like in screenshot
我的项目代码在这里. onAfterSaveCell(value,name){ axios({ method:'post',url:'https://something.something.com.somewhere/update_something',headers: { 'Accept': 'application/json','Content-Type': 'application/json','x-access-token':this.state.token },data:{ name:value[name] } }) .then((response)=>{ this .getCustomerData(); }) .catch((error)=>{ throw('error',error); }); } 反应引导就在这里 <BootstrapTable data={this.state.customer_data} search={true} cellEdit={ { mode: "click",blurToSave: true,afterSaveCell: this.onAfterSaveCell } } > <TableHeaderColumn dataField="tid" isKey = {true} dataSort={true} width="70">S.No</TableHeaderColumn> <TableHeaderColumn dataField="company_name" dataSort={true}>Company Name</TableHeaderColumn> <TableHeaderColumn dataField="contact_address" dataSort={true}>Contact Address</TableHeaderColumn> <TableHeaderColumn dataField="contact_person" dataSort={true}>Contact Person</TableHeaderColumn> <TableHeaderColumn dataField="contact_number" dataSort = {true}>Contact Number</TableHeaderColumn> </BootstrapTable> 解决方法
谈论v3.0.0-beta-11(之前我没有使用它).
没有问题. 但是在您的代码中,您的范围并不合适. 所以只需修复它,以便在Component范围上调用onAfterSaveCell: afterSaveCell: this.onAfterSaveCell.bind(this) (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |