关于前端:关于Antd中table列Fixed导致的expandedRowRender展开行错位问题

右侧操作列的属性为fixed：'right'
在开展行时呈现列错位的问题

关上element发现列属性设置为fixed后在DOM中是独立进去的

解决办法：

<a-table        :columns="columns"        :data-source="data"        bordered        :pagination="false"        :scroll="{          x: 1500,          y: 'calc(100vh - 186px)',          scrollToFirstRowOnChange: true,        }"        :row-key="record => record.key"        :expanded-row-keys.sync="expandedRowKeys"        @expand="expandedOneRow"      >        <a-table          slot="expandedRowRender"          slot-scope="record"          :columns="columnsa"          :data-source="record.exPandTable"          :pagination="false"        >        </a-table>        <template slot="progress" slot-scope="progress">          <a-progress :percent="progress" />        </template>              </a-table>

expandedOneRow(expanded,rec){      if(expanded){        this.expandedRowKeys = [];        this.expandedRowKeys.push(rec.key)      }else{        this.expandedRowKeys = [];      }      this.$nextTick(()=>{        setTimeout(() => {           const element = document.querySelectorAll(`[data-row-key='${rec.key}-extra-row']`)        // 33 是td 的 padding 值 加 border值        const height = element[0].getBoundingClientRect().height - 33        element[1].childNodes[0].innerHTML = `<div style="height: ${height}px;"></div>`        }, 0)      })    },

最初贴一张改变后的效果图