如何更改 MobileDatePicker 组件的接受和取消按钮文本

Question

@mui/x-date-pickers 包中的 MobileDatePicker 包含带有默认文本“确定”/“取消”的接受/更改按钮。

在 v4 中，DatePicker 组件有一个 AcceptLabel/cancelLabel 属性来更改按钮的文本，但我发现 v5 组件有类似的内容。

如何更改 v5 中按钮的文本？

Answer 1

我终于通过编写自定义 ActionBar 组件成功做到了这一点

const MyActionBar = ({
  onAccept,
  onCancel,
  onClear,
  onSetToday,
}: PickersActionBarProps) => {

  return (
    <DialogActions>
      <Button onClick={onClear}> customCleanText </Button>
      <Button onClick={onCancel}> customCancelText </Button>
      <Button onClick={onAccept}> customAcceptText </Button>
    </DialogActions>
  );
};

并覆盖我的 MobileDatePicker 组件中的 bar 组件

<MobileDatePicker
  //...
  components: {{
    ActionBar: MyActionBar
  }}
  />