关于前端:怎么在Dom元素全屏的时候让Element的select组件正常显示

最近我的项目开发中，遇到一个奇怪的bug：在应用Element的select组件时，当Dom元素全屏模式的时候，select组件的下拉菜单不见了。

奇怪的是，查看控制台发现，select组件的Dom节点实际上是存在的。

解决方案

Element官网提供了解决方案，popper-append-to-body属性，是否将弹出框插入至body元素。当值为false的时候，这时即便Dom元素处于全屏模式，select组件也失常显示。

<el-select
  v-model="value"
  placeholder="请抉择"
  :popper-append-to-body="false"
>
  <el-option
    v-for="item in options"
    :key="item.value"
    :label="item.label"
    :value="item.value"
  >
  </el-option>
</el-select>

示例代码下载

能够复制以上代码运行查看应用成果，也能够到GitHub: https://github.com/Jackyyans/code123下载，更多示例将会继续更新，欢送关注。

作者：代码123
原文链接：http://www.getcode123.com/how-to-show-select-component-fullscreen
版权申明：转载请附上原文链接