MUI v5 搭配TextField使用的Select组件为何出现菜单横向渲染问题

• 父容器布局异常：包裹TextField/Select的父元素如果设置了display: flex且未指定flex-direction: column，或者设置了不合理的宽度、overflow属性，会导致下拉菜单挂载的Popper组件继承异常布局上下文，触发横向排列。
• 组件样式引入/覆盖错误：如果是按需引入MUI组件，未完整引入Select、Menu、MenuItem的配套样式，或是自定义主题时错误修改了.MuiMenuItem-root的默认display: block属性，会导致菜单项默认变为行内元素横向排列。
• 组件属性配置错误：给Select组件传入的MenuProps中如果手动配置了PaperProps修改内部菜单容器的布局，比如强制设置display: flex、flexDirection: 'row'，会直接触发横向渲染。
• 全局样式污染：全局CSS如果对原生li标签，或是.MuiMenuItem-root、.MuiMenu-list类设置了display: inline-block、float: left等属性，会覆盖组件默认样式，导致横向排列。

内容的提问来源于stack exchange，提问作者Dom