实例:
js请求
editEvent ({ row, column }, event) {
axios({
method:"post",
url:"/newProductOrder/modifyQuantity",
params:{
id:row.id,
purchase_quantity:row.purchase_quantity
}
}).then((res)=>{
if(res.status==200){
if(res.data.state=="fail"){
this.$message.error(res.data.msg);
}else{
}
}else{
this.$message.error('网络请求失败');
}
})
},
前端代码
<vxe-grid ref="table" :data="datas" :border="true"
@sort-change="sortChange" :sort-config={remote:true} stripe
:edit-config="{trigger: 'click', mode: 'cell'}"
@edit-closed="editEvent"
size="mini" :height="tableHeight" style="width: 100%" resizable
highlight-hover-row highlight-current-row>
<vxe-table-column
field="project_code" title="项目代码" show-overflow width="90"></vxe-table-column>
<vxe-table-column
field="product_code" title="产品件号" show-overflow width="90" fixed="left"></vxe-table-column>
<vxe-table-column
field="part_no" title="零件号" show-overflow width="90" fixed="left"></vxe-table-column>
<vxe-table-column
field="product_code" title="零件名称" show-overflow width="90" fixed="left"></vxe-table-column>
<vxe-table-column
field="version_no" title="版本号" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="attribute" title="属性(共用/专用)" show-overflow width="140" ></vxe-table-column>
<vxe-table-column
field="orderRequireNum" title="订单需求数量" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="inTransitOrder" title="在途订单" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="onHandInventory" title="车间现有库存" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="outPurchase" title="外购有库存" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="gapNum" title="满足订单缺口数量" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="ifHaveBom" title="无BOM提醒" show-overflow width="90" ></vxe-table-column>
<vxe-table-column
field="purchase_quantity" title="需求采购量" :edit-render="{}" show-overflow width="90" >
<template #edit="{ row }">
<vxe-input v-model="row.purchase_quantity" v-if="row.canReview" type="text"></vxe-input>
</template>
</vxe-table-column>
</vxe-grid>
小白重点:
留下疑问:
不使用表的@edit-closed触发 而使用 vxe-input的@input触发时,我每输入一次,事件触发2次 不知道为什么触发2次不是一次
vxe官方文档:vxe