查看原文

? 不吹牛，完爆ant deisgn的定位组件！floating-ui来也

内容简介：

红框部分是用绝对定位放在按钮上面的，你们B端用的主流组件库都是这样实现的，它是很多组件的基础组件，比如下图：下拉框组件select组件还有什么DataPicker，TreeSelect，Dropdown组件等等的下拉框都是以定位组件为基础的。上面提到，这不过就是一个绝对定位嘛（我们假设红框部分的的dom绝对定位是相较于body元素），我们拿最简单的情况来看，如下图，如何把红框部分渲染到按钮”更多“的下方呢？我们可以计算更多按钮的getBoundingRect()，返回所以红框部分左上角的坐标就轻易的计算出来了,上面的数据在reference对象上，所以借助reference的定位，我们计算红框部分的下拉框的定位是在哪为啥是上面这么计算呢，假如没有滚动条滚动，那么红框部分的绝对定位的top，是...

?更多精彩头条内容，请收藏程序员导航网，为您提供一站式码农必备网址大全，持续为您输出优质站点和IT信息！