vue 表头固定

利用ref操作dom元素，详情请看代码：
html:

    

          

            

              

                
sum
                
Price
                
Delta
                
Delta_Pct
                
Gamma
                
Gamma_Pct
                
Theta
                
Theta_Pct
                
Vega
                
Vega_Pct
              
            
            

              

                
{{val}}
              
            
          
        

css:

.table-scroll-mod {
    position: relative;
    height: 65px;
    overflow: hidden;
    .table-scroll-box {
      white-space: nowrap;
      overflow: scroll;
      height: 500px;
      z-index: 1001px;
      .fixed-head {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1000;
        width: 100%;
      }

js:

mounted() {
    let self = this;
    let box = self.$refs.tableScrollBox;
    box.addEventListener('scroll', () => {
      var scrollTop = box.scrollTop;
      var fixedHead = self.$refs.tableFixedHead;
      fixedHead.scrollTop = scrollTop;
    }, false)
    
}, 

如有更好的方法，欢迎大家一起讨论