element-ui table中表格错误问题解决

Posted fangnianqin

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了element-ui table中表格错误问题解决相关的知识,希望对你有一定的参考价值。

技术图片
在iframe关闭和切换导航会引起有table的表格错位,解决办法:

handleAdminNavTab: function(tab) {
          var adminContent = this.$el.querySelector('.sc-admin__content__bd');
          var iframes = adminContent.querySelectorAll('iframe');
          this.$nextTick(function() {
              var url = 'projectController';
              iframes = Array.prototype.slice.call(iframes);
              iframes.forEach(function(iframe) {
                  if (iframe.src.indexOf(url) !== -1) {
                      var vm = iframe.contentWindow.vm;
                      if (vm && vm.$refs) {
                          //刷新表格布局
                          vm.$refs.table && vm.$refs.table.doLayout();
                      }
                  }
              });
          });
      }

主要是调用: vm.$refs.table && vm.$refs.table.doLayout();

记录下renderCell的用法(与上文问题无关):

 { label: '批注项', prop: 'commentItem' ,align:"center" , minWidth:"200",renderCell:function(h,scope){
                 return  h('div',{domProps:{
                          innerhtml:scope.row.commentItem
                     }})
 }},

以上是关于element-ui table中表格错误问题解决的主要内容,如果未能解决你的问题,请参考以下文章

解决element-ui中table表格row-style改变当前行样式失效问题

Element-ui中 表格(Table)组件中 toggleRowSelection 方法设置默认多选项 无法选中解决思路

解决element-ui table expend扩展里边需要请求表格数据第一次不渲染的问题

element-ui 中表格嵌套表单 如何给table表头添加必填*星号

element-ui 中表格嵌套表单 如何给table表头添加必填*星号

Element-ui组件库Table表格导出Excel表格--存在重复数据问题