一、删除
先在VS里面写Dal层与控制器的代码
DAL层
//删除 public int Del(int id) { try { var obj = db.GGMM3.FirstOrDefault(u => u.SId == id); if (obj != null) { db.GGMM3.Remove(obj); } return db.SaveChanges(); } catch (Exception) { throw; } }
控制器的代码 //删除 [HttpPost] public IHttpActionResult Del(int id) { return Json(dal.Del(id)); }
再在Vue Code里面 先建个按钮其次在VUE里面写代码
<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
handleDelete(index, row) { if(confirm(‘确定要删除吗‘)){ this.$axios.post(‘http://localhost:51049/api/Goode/Del?id=‘+row.SId).then(res=>{ if(res.data>0){ alert(‘删除成功‘) this.loadData(); }else{ alert(‘删除失败‘) } }) } console.log(index, row); },
二、赋值
先写按钮的功能其次在写vue
<el-button size="mini" @click="handleEdit( scope.row)">编辑</el-button>
//赋值 handleEdit(row) { this.$router.push({ path: ‘/edit‘, query:row }) //console.log(index, row); },
然后在跳转的另一个页面里面写赋值的内容在created里面写赋值的代码
//赋值数据 this.form= this.$route.query; //赋值图片 this.imageUrl=this.form.SImg; //赋值分类 this.form.TId=this.$route.query.TName; //赋值商品分类 this.optAName=this.$route.query.CName this.optBName=this.$route.query.CCName
三、二级联动。级联
在vs控制器里面先把后台写了
DAL //联动 public List<GoodeModel> LianDong(int pid) { return db.GGMM.Where(u => u.PId == pid).ToList(); } 控制器 //联动 [HttpGet] public IHttpActionResult LianDong(int pid) { return Json(dal.LianDong(pid)); }
在VUE Code里面找框架把代码代入进去
<el-row v-show="isShow"> <el-col :span="10"> <el-cascader-panel :options="options" :props="{value:‘CId‘,label:‘CName‘}" ref="optA" @change="LianDong2"></el-cascader-panel> </el-col> <el-col :span="10"> <el-cascader-panel :options="options2" :props="{value:‘CId‘,label:‘CName‘}" ref="optB"></el-cascader-panel> </el-col> </el-row>
//二级联动1 LianDong1(){ this.$axios.get(‘http://localhost:51049/api/Goode/LianDong?pid=0‘).then(res=>{ this.options=res.data }) }, //二级联动2 LianDong2(value){ this.form.CId=value[0]; this.$axios.get(`http://localhost:51049/api/Goode/LianDong?pid=${value[0]}`).then(res=>{ this.options2=res.data }) },
原文:https://www.cnblogs.com/li660/p/15302460.html