如何将 aria-required 添加到 Material-UI 选择组件答案

【问题标题】：How to add aria-required to Material-UI select component如何将 aria-required 添加到 Material-UI 选择组件
【发布时间】：2021-02-01 10:43:26
【问题描述】：

我正在努力为 Material-UI 组件添加“需要 aria”属性。有没有人有这方面的经验？我没有尝试任何东西，因为文档没有谈论它。谢谢。

【问题讨论】：

标签： html reactjs material-ui accessibility

【解决方案1】：

你不能这样做吗？

<Button aria-required="true" variant="contained" color="primary">
  Hello World
</Button>

如果您将属性存储在变量中：

const myAttributes = {
  "aria-required": "true"
};
return (
  <Button {...myAttributes} variant="contained" color="primary">
    Hello World
  </Button>
);

编辑：将属性添加到<Select /> 组件

<Select
  // add the attribute to the container
  aria-required="true"
  // add the attribute to the input element
  inputProps={{
    "aria-required": "true"
  }}
>
  {...}
</Select>

现场演示

【讨论】：

嗨，很遗憾，您的解决方案不适合我。我正在尝试将 aria-required 添加到 Select 组件中。
我尝试将它直接添加到组件和 inputProps 中，但它们都不适用于我
@NetanelVaknin 查看我的更新答案，如果它对您不起作用，请将有问题的代码添加到问题中以及您的 @material-ui/core 版本中。
感谢您的回复！我的@material-ui/core 版本是 4.9.13 我完全按照您在此处发送的方式进行了操作，我可以看到在浏览器中检查元素时添加了属性 aria-required="true"。无论如何，我的屏幕阅读器不会为我阅读。
我不使用屏幕阅读器，所以除了检查 dom 元素之外我不知道如何调试它。请参阅this 回答，看看它是否可以帮助您。 @NetanelVaknin