小程序中如何固定表头和首列

  
    
      {{attrItem.title}}
    
  


  
    
      
      
        {{dataIndex}}
      
    
  

.table{
  display: block;
  position: relative;
  overflow: scroll;
  width: 100%;
  height: 50vh;
}
.table__head{
  height: 96rpx;
  white-space: nowrap;
  position: sticky;
  top: 0rpx;
  z-index: 100;
  height: 88rpx;
  font-size: 24rpx;
  line-height: 88rpx;
  color: #aaabbd;
  background-color: #f8f8f8;
  border-bottom: 2rpx solid #ecf1f8;
  background-color: #fff;
  white-space: nowrap;
  display: flex;
}
.table__head__td{
  width: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
}
.table__head__td:nth-child(1) {
  padding-left: 24rpx;
  width: 260rpx;
  position: sticky;
  z-index: 101;
  left: 0rpx;
}
.table__head__td__text{
  display: inline;
}
.table__row{
  position: relative;
  height: 96rpx;
  white-space: nowrap;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 2rpx solid #ecf1f8;
}
.table__row__td{
  overflow: scroll;
  white-space: nowrap;
  width: 200rpx;
  display: inline-block;
  background-color: #fff;
  box-sizing: border-box;
  font-size: 26rpx;
  line-height: 96rpx;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  text-align: center;
}
.table__row__td:nth-child(1) {
  padding-left: 24rpx;
  width: 260rpx;
  position: sticky;
  z-index: 10;
  left: 0;
}

Page({
  data: {
    headList: [
      { title: '第一列' },
      { title: '第二列' },
      { title: '第三列' },
      { title: '第四列' },
      { title: '第五列' },
      { title: '第六列' },
    ],
    tableHeight: (200 + 1) * 96,
    tableWidth: 200 * 6 + 60,
  },
  scrollY(e) {
    this.setData({
      scrollTop: e.detail.scrollTop,
    });
  },
  scrollX(e) {
    this.setData({
      scrollLeft: e.detail.scrollLeft,
    });
  },
  onLoad() {
    my.setCanPullDown({
      canPullDown:false
    });
  },
})