微信小程序做Table表格

实现效果：表格头部固定，表格内容数据可以滚动
这只是一个最基本的表格框架。
头部

  <view class="table">
    <view class="tr">
      <view class="td">序号</view>
      <view class="td">唯一XX</view>
      <view class="td">列名一</view>
      <view class="td">列名二</view>
      <view class="td">列名三</view>
      <view class="td">列名四</view>
      <view class="td">列名五</view>
      <view class="tdtd2">列名六</view>
      <view class="td td2">列名七</view>
    </view>
  </view>

表格内容

<view class='table-scrolling'>
    <view class="table">
      <view class="tr" wx:for="{{datas}}" wx:key="unique">
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
        <view class="td">***</view>
      </view>
    </view>
  </view>

样式

 . table-scrolling {
     overflow-y: scroll;
     overflow-x: hidden;
 }

.table {
  border: 1px solid #724f4f;
  border-bottom: 0;
  width: 98%;
  margin-left: 1%;
  word-break: break-all;
}

.tr {
  display: flex;
}

.td {
  border: 0.5px solid #724f4f;
  text-align: center;
  width: 10%;
}