业务需求
表格内部某条数据需要用户自己填,最后一栏有操作按钮,并且当窗口宽度不够时也需看到操作按钮。
实现方法
将操作栏的<el-table-column></ el-table-column >标签添加 fixed=" right "属性。
由于是动态表格,所以无法v-model,所以需要原生input,在input标签上绑定id为scop.row.uuid方便查找。
引发的问题
当窗口宽度不足,出现横向滚动条时候,浏览器打印台会报出现重复id的dom元素的警告
原因及解决办法
element ui中的fixed悬浮其实是生成了两套一模一样的数据,当横向滚动条出现时会展示有悬浮的那一套,滚动条未出现时会展示无悬浮的那一套,而这两套是共同存在与页面中的,所以就会报重复id的dom元素的错误
这种情况是无法使用fixed的,所以需要去除fixed或者使用vue中的ref进行代替。