BFC引起的loading动画跳动BUG

BUG现象

当列表加载时，loading动画在加载过程中出现跳动问题。

BUG原因

以下为列表结构：

<div class="ant-spin-nested-loading">
    <div class="ant-spin-container">
        <div style="height:90px">列表内容</div>
        <div style="float: right;height:30px">分页工具条</div>
    </div>
</div>

当列表加载时，会给列表的内容加上一个遮罩层，同时加上loading动画。

<div class="ant-spin-nested-loading">
    <div class="loading">我是loading动画</div>
    <div class="ant-spin-container ant-spin-blur">
        <div style="height:90px">列表内容</div>
        <div style="float: right;height:30px">分页工具条</div>
    </div>
</div>

遮罩层表现在代码上就是会给.ant-spin-container内容加上一个.ant-spin-blur，在加载完毕后移除。
以下是 .ant-spin-blur简化了兼容性之后的样式

.ant-spin-blur{
    overflow: hidden;
    opacity: 0.7;
    filter: blur(0.5px);
    -webkit-transform: translateZ(0);
}

在没加ant-spin-blur之前，ant-spin-nested-loading的高度是90px,因为float元素的高度计算并没有列入其中。
在加上ant-spin-blur之后，ant-spin-nested-loading的高度为120px，因为overflow:hidden导致ant-spin-container所在的div形成了一个BFC，而在BFC中，浮动元素的高度会纳入到总高度的计算中。

而loading动画所在的div是根据.ant-spin-nested-loading所在元素的高度动态计算位置，出现在中间高度，那么就会导致在移除ant-spin-blur时，总高度变小，导致loading动画的位置发生改变。