MUI v5 日期选择器：有没有办法删除 SwitchViewButton？

【问题标题】：MUI v5 Date Pickers: Is there a way to remove the SwitchViewButton?MUI v5 日期选择器：有没有办法删除 SwitchViewButton？
【发布时间】：2022-08-05 23:42:45
【问题描述】：

有没有办法从日历选择器中删除 SwitchViewButton（显示月份和年份的按钮）或用我自己的组件替换它？

他们的 API 提供了以下属性来在 StaticDatePicker 中修改它们： components = { LeftArrowButton?: elementType, LeftArrowIcon?: elementType, OpenPickerIcon?: elementType, RightArrowButton?: elementType, RightArrowIcon?: elementType, SwitchViewButton?: elementType, SwitchViewIcon?: elementType }

但是当我尝试向其中任何一个发送“null”时，它会完全忽略它们并呈现相同的东西。

Date Picker view

标签： reactjs material-ui datepicker

【解决方案1】：

我没有将null 传递给他们，而是通过将sx 值传递给每个人的道具来让它们不显示。

所以而不是：

<DatePicker
     components={{SwitchViewButton: null}}
/>

你可以做：

<DatePicker
     componentProps={{
          switchViewButton: { sx: { display: 'none' } }
     }}
/>

它并不完美，但至少在我有限的经验中可以完成工作。我认为这是因为当您将 null 传递给 component 属性时，它只使用默认值。

笔记：components 属性使用 Pascal 大小写 (ActionBar)，而 componentsProps 使用骆驼大小写 (actionBar) 每 documentation

【讨论】：