重复问题
- 我搜索了现有的问题
- 有很多重复的问题,这正是这个工单的重点。
最新版本
- 我测试了最新版本
总结💡
MUI 是一个非常棒的库,它基本上可以作为现有 UI 范式的替代品。有一个 <input>
吗?用一个 MUI 的 <Textbox>
替换它,会让它看起来更好,功能更多。你可能需要花两秒钟阅读文档,但然后你可以轻松地实现它 ... 对于 MUI 中的几乎每件事都是如此 ... 除了 Select。
如果你谷歌一下,你会发现 数百个 人们在使用 MUI Select(例如控制其宽度或提供占位符值)时遇到的问题。其中许多问题/Stack Overflow帖子/等没有解决方案,但在那些有解决方案的情况下,大多数情况下的解决方法是 .... 使用 Textbox(带有 select 选项)。
从根本上说,当每个人都必须使用 MUI 的 <input>
来完成相当于 <select>
的功能时,有些事情是不正确的。MUI Select 组件应该解决大多数人下拉需求的绝大部分,而 Textbox with a select prop 应该在特殊情况下很少使用。事实证明,这是用户的一个痛点(如互联网上的所有问题所示)。
而且,如果你真的想让人们使用文本框选择器,那也没关系 ... 但请说出来!弃用 Select 并告诉人们使用 Textbox 而不是 :)。或者至少在 Select 页面顶部放一个大横幅,告诉大家应该认真考虑一下。
现在你有一个组件,它做得不好,无法履行其职能(所以大家都不得不用另一个组件代替它)。请,要么让它做好自己的工作,要么不要让每个人都去互联网上寻找答案 ... 只是告诉我们应该使用哪个组件。
示例🌈
这就像 20 秒的谷歌搜索;还有更多:
https://stackoverflow.com/questions/73386626/how-can-i-prevent-mui-select-component-width-from-getting-expanded-as-i-select-m
https://stackoverflow.com/questions/51408492/set-the-width-of-material-ui-select-based-on-label-size
https://stackoverflow.com/questions/56120213/set-material-ui-select-width
https://stackoverflow.com/questions/59260429/how-to-increase-the-width-of-material-ui-dropdown
https://stackoverflow.com/questions/64644708/material-ui-set-select-to-be-as-wide-as-widest-menuitem
https://stackoverflow.com/questions/76983668/adding-max-width-to-a-materialui-select-element
https://stackoverflow.com/questions/73807962/having-trouble-implementing-placeholder-in-textfield-that-has-select-prop-mui
https://stackoverflow.com/questions/58645424/select-placeholder-styling
https://stackoverflow.com/questions/54289877/change-text-colour-of-placeholder-in-select-drop-down-material-ui
#8778
#20689
#3923
#10917
#33559
#18797
#11069
动机🔦
我只是想能够
- 访问 MUI 的网站
- 找到正确执行基本操作的方法(渲染一个下拉菜单,而不是让它或它的选项变得非常小)
- 从文档中轻松实现那种方式。
这就是我所要求的全部 ... 但从根本上说,在当前的 Select 组件及其文档中是不可能实现上述内容的。
4条答案
按热度按时间whhtz7ly1#
你关闭这个问题的原因是什么?@jwalkerinterpres
iovurdzv2#
我觉得我可能过于关注我的用例,我不想浪费维护者的时间在一个看起来像是无知用户抱怨的工单上。
vvppvyoh3#
我认为你遇到的这个问题是公平的。让我重新打开这个问题。
5tmbdcev4#
请注意,解决此问题的最低成本方案可能是:
A) 列出人们何时应该使用
<Select>
以及何时应该使用<TextField select>
B) 在 https://mui.com/material-ui/react-select/ 的顶部(或单独页面上,带有指向 Select 页面上该页面的链接)展示
C) 可能在 https://mui.com/material-ui/react-text-field/ 的顶部添加一条注解或链接...但我怀疑这是否有必要,因为没有人在 TextField 文档中寻找下拉式用户界面解决方案(这正是本票据的重点...)