at-ui icon indicating copy to clipboard operation
at-ui copied to clipboard

table组件中optional复选框,在静态数据中可以正常显示,但是在动态数据中出现了问题

Open wly529909391 opened this issue 7 years ago • 5 comments

,这是基本html组件标签;

new Vue({ el: '#app', data:{ columns1: [{ title: '姓名', key: 'name' }, { title: '登录名', key: 'loginName', sortType: 'normal' }, { title: '邮箱', key: 'email' } ], data3: [], pagenation : { current : 1, total : 0 }, userName : '' }, mounted : function(){ this.$nextTick(function () { this.loadUser(); }) }, methods:{ loadUser : function(page){ var obj = {pageNo:page ? page : 1,pageSize:10,name:this.userName}; this.$http.post( '/cggl/a/sys/user/getUsers', obj, {emulateJSON:true} ).then(function(res){ // console.log(res); this.data3 = res.body.list; this.pagenation.total = res.body.count; },function(){ this.$Message.error('服务器请求失败!') }); }, pageChange : function(currentPage){ this.loadUser(currentPage); } } }) 这是vue实例。 在at-table组件中不加optional,页面正常,并且可以实现分页功能;但是在加了optional参数后则页面报错,报错信息: vue.min.js:6 TypeError: Cannot read property 'isChecked' of undefined at o.isSelectAll (at.min.js:4779) at St.get (vue.min.js:6) at St.evaluate (vue.min.js:6) at o.isSelectAll (vue.min.js:6) at o.render (at.min.js:8982) at o.fn._render (vue.min.js:6) at o. (vue.min.js:6) at St.get (vue.min.js:6) at St.run (vue.min.js:6) at At (vue.min.js:6) He @ vue.min.js:6 Re @ vue.min.js:6 Fe @ vue.min.js:6 fn._render @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.get @ vue.min.js:6 St.run @ vue.min.js:6 At @ vue.min.js:6 (anonymous) @ vue.min.js:6 Ke @ vue.min.js:6 Promise resolved (async) Be @ vue.min.js:6 Ze @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.update @ vue.min.js:6 oe.notify @ vue.min.js:6 set @ vue.min.js:6 Et.Tt.set @ vue.min.js:6 (anonymous) @ userListUikit.html:74 Promise resolved (async) r.then @ vue-resource.js:7 loadUser @ userListUikit.html:72 (anonymous) @ userListUikit.html:62 (anonymous) @ vue.min.js:6 Ke @ vue.min.js:6 Promise resolved (async) Be @ vue.min.js:6 Ze @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.update @ vue.min.js:6 oe.notify @ vue.min.js:6 set @ vue.min.js:6 Et.Tt.set @ vue.min.js:6 makeDataWithSortAndPage @ at.min.js:4832 created @ at.min.js:4935 _t @ vue.min.js:6 hn._init @ vue.min.js:6 o @ vue.min.js:6 (anonymous) @ vue.min.js:6 init @ vue.min.js:6 (anonymous) @ vue.min.js:6 b @ vue.min.js:6 v @ vue.min.js:6 b @ vue.min.js:6 v @ vue.min.js:6 b @ vue.min.js:6 (anonymous) @ vue.min.js:6 _update @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.get @ vue.min.js:6 St @ vue.min.js:6 hn.$mount @ vue.min.js:6 hn.$mount @ vue.min.js:6 hn._init @ vue.min.js:6 hn @ vue.min.js:6 (anonymous) @ userListUikit.html:36 vue.min.js:6 TypeError: Cannot read property 'querySelectorAll' of undefined at o. (at.min.js:4919) at Array. (vue.min.js:6) at Ke (vue.min.js:6) at He @ vue.min.js:6 Re @ vue.min.js:6 Fe @ vue.min.js:6 (anonymous) @ vue.min.js:6 Ke @ vue.min.js:6 Promise resolved (async) Be @ vue.min.js:6 Ze @ vue.min.js:6 fn.$nextTick @ vue.min.js:6 handleResize @ at.min.js:4917 sortData @ at.min.js:4762 St.run @ vue.min.js:6 At @ vue.min.js:6 (anonymous) @ vue.min.js:6 Ke @ vue.min.js:6 Promise resolved (async) Be @ vue.min.js:6 Ze @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.update @ vue.min.js:6 oe.notify @ vue.min.js:6 set @ vue.min.js:6 Et.Tt.set @ vue.min.js:6 (anonymous) @ userListUikit.html:74 Promise resolved (async) r.then @ vue-resource.js:7 loadUser @ userListUikit.html:72 (anonymous) @ userListUikit.html:62 (anonymous) @ vue.min.js:6 Ke @ vue.min.js:6 Promise resolved (async) Be @ vue.min.js:6 Ze @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.update @ vue.min.js:6 oe.notify @ vue.min.js:6 set @ vue.min.js:6 Et.Tt.set @ vue.min.js:6 makeDataWithSortAndPage @ at.min.js:4832 created @ at.min.js:4935 _t @ vue.min.js:6 hn._init @ vue.min.js:6 o @ vue.min.js:6 (anonymous) @ vue.min.js:6 init @ vue.min.js:6 (anonymous) @ vue.min.js:6 b @ vue.min.js:6 v @ vue.min.js:6 b @ vue.min.js:6 v @ vue.min.js:6 b @ vue.min.js:6 (anonymous) @ vue.min.js:6 _update @ vue.min.js:6 (anonymous) @ vue.min.js:6 St.get @ vue.min.js:6 St @ vue.min.js:6 hn.$mount @ vue.min.js:6 hn.$mount @ vue.min.js:6 hn._init @ vue.min.js:6 hn @ vue.min.js:6 (anonymous) @ userListUikit.html:36

wly529909391 avatar May 16 '18 09:05 wly529909391

一直没有修复

denamsoul avatar Aug 30 '18 12:08 denamsoul

问题描述

我也碰到了这个问题,表现为使用静态的数据可以渲染表格前的多选按钮,但是如果后来改变了这个数据,而且新的数据的行数要比之前多就会出现这个问题,举例来说:一开始静态数据有5条,这5条是可以正常初始化带optional选项的表格,但是如果后来动态改变了数据到6条, 那么多的那一条在渲染时会报错,具体错误如下图 image image 原因我猜是代码中不会根据数据条数来重新生成前面的input选择按钮,导致数据条数一旦比最开始初始化的时候多就会导致多的那些数据没有对应的input选择按钮,然后报错。

临时解决方案

目前来说暂时的解决方案是你的表格一页想要展现多少条数据,那么初始化的时候写入多少条空数据,之后通过ajax或者其他方式生成了真实的数据以后再把这些假数据替换掉。 例如如果你的表格要展示10条数据,那么在你绑定的数据中就写上[{}, {}, {}, {}, {}, {}, {}, {}, {}, {}, ],这样暂时能保证表示初始化正常,后期改变这10条数据也能正确渲染上,但是毕竟不是最合适的解决方案,还是希望官方能够尽快修复这个bug!

kricsleo avatar Sep 30 '18 10:09 kricsleo

发现相同问题,期待修复中。。。

HAVENT81 avatar Oct 15 '18 09:10 HAVENT81

使用这个插件库的时候也遇到这个问题了,不过经过折腾发现可以这样处理。 修改源码: watch监听事件中: watch: { allData () { this.total = this.allData.length this.objData = this.makeObjData() // 增加该段代码 } }

turboxp53 avatar Apr 22 '19 12:04 turboxp53

还是没有修复吗,我发现我切换pagesize时会报Cannot read property 'isChecked' of undefined

freemaple avatar Oct 27 '21 05:10 freemaple