网站建设都包括,在本地做改版如何替换旧网站会影响百度收录吗,电脑培训课程,深圳市罗湖建设局网站一#xff1a;先使用Vue.js绑定好数据与更新事件使用v-on绑定好事件,在事件里边直接把该行数据传递进去#xff0c;在更新方法里边就可以直接取出需要更新的数据选择用户名学号班级操作{{item.UserName}}{{item.Number}}{{item.Class}}删除更新//实例化vue.js(用来给表格提供…一先使用Vue.js绑定好数据与更新事件使用v-on绑定好事件,在事件里边直接把该行数据传递进去在更新方法里边就可以直接取出需要更新的数据选择用户名学号班级操作{{item.UserName}}{{item.Number}}{{item.Class}}删除更新//实例化vue.js(用来给表格提供数据的)var vm new Vue({el: #content,data: {mydata: data},methods: {udelete: function (_id) //删除{},updateu: function (item) //更新{}}});效果如下二点击更新事件弹出layer更新框先写好html* 给layer弹出层提供数据 *用户名:学号:班级:弹出layerupdateu: function (item) //更新{layer.open({type: 1,title: 更新,area: [300px, 230px],content: $(#updatecontent),btn: [保存],yes: function (index) {alert(点击保存);},cancel: function () { //点击关闭按钮}});}效果如下三为layer弹框提供好数据传统的做法就是把值一个一个的取出来然后在赋值给文本框现在可以使用vue.js一次性绑定好实例化一个vue专门为弹框内的文本框提供数据//给更新div添加数据var update_vm new Vue({el: #updatecontent,data: {userinfo: {}}});点击更新按钮的时候我们已经把该行的值通过一个对象传过来了,直接绑定到vue.js里边updateu: function (item) //更新{update_vm.$data.userinfo item;}这样就能在点击的时候拿到需要更新的数据了而且由于双向绑定当文本框发送变化的时候表格内容也会自动变化四点击保存实现更新传统的做法就是拿到更新后的值也就是更具id获取文本框的值然后组装成json对象传入后台就可以实现更新。使用vue.js就可以避免自己组装对象了因为是双向绑定文本框的值改变model值自动改变我们直接把Model的值传回后台实现更新就行了layer.open({type: 1,title: 更新,area: [300px, 230px],content: $(#updatecontent),btn: [保存],yes: function (index) {//调用后台实现更新$.post(/home/UpdateU, update_vm.$data.userinfo, function (result) {});},cancel: function () { //点击关闭按钮}});后台使用ef直接更新就行了//更新public JsonResult UpdateU(Users uinfo){testEntities en new testEntities();en.Entry(uinfo).State System.Data.EntityState.Modified;int count en.SaveChanges();return Json(count);}以上使用vuelayer实现更新没有任何组织数据的地方,我们子需要关注数据本身就行了如果在改变文本框值得时候不希望表格内自动改变可以克隆一个对象在绑定因为这样如果用户点击了关闭需要自己会恢复成没有更新的数据利用jquery克隆一个对象在绑定就而已了updateu: function (item) //更新{//克隆一个对象var databack $.extend({}, item);update_vm.$data.userinfo databack;}这样的话数据库是更新了页面没有被更新可以直接刷新网页当然也可以使用更新Model来更新页面直接把vue.js数据替换从而更新更新到页面$.post(/home/UpdateU, update_vm.$data.userinfo, function (result) {//可以把vue.js数据替换从而更新更新到页面vm.$data.mydata.splice(index, index, update_vm.$data.userinfo);});以上这篇Vue.jsLayer表格数据绑定与实现更新的实例就是小编分享给大家的全部内容了希望能给大家一个参考也希望大家多多支持脚本之家。
