Select下拉框被overflow遮挡的问题

问题概述

  如果你没有使用插件，没有使用别人给的组件，这个问题一般是不会出现的。但是如果你使用了别人的组件，那么你就会遇到这个问题。我这里说说我遇到的这个问题的地方，总共是2个地方。

1. 是我在使用iview的，使用select，由于父级框position: relative，并且overflow:auto，所以select下拉框的时候就被挡在父级下面（虽然滚动可以看到，但是觉得很不舒服）
2. 是我在使用vue-treeselect的时候，这个哥们也是和上面一样，被挡在了下面。（这个不演示了，道理一样）

上述问题的解决

1. iview的select组件里面有一个transfer属性，添加就可以使下拉框到最高层，没有东西可以遮挡。
2. vue-treeselect是采用了里面的appendToBody属性为true，和设置z-index属性为9999，使之到最高层显示。（这个不演示了，道理一样）

分析

  上面两种的select插件处理方法也是人家插件里面准备好的，我只是使用而已。但是我在前端通过源代码的查看，发现其实他们的处理方式是一摸一样的。

  他们的处理方式都是将下拉框整体加入到body里面，这样下拉框所处的位置就不是原来select的父级框下面了，而是在body里面，然后定位到指定位置，通过position和z-index，绝对定位absoult到指定的位置，然后将层级提高，这样的下拉框显示出来就是最高层级，也不会收到父级框的限制。