如何在上下文中使用材质UI的输入API的错误属性和css

Question

我需要使用 MUI 输入 API 道具和 CSS 进行 {错误} 及其使用。

我的代码看起来像这样：

const [value, setValue] = useState<string>(cell.value);
const [startAdornment, setStartAdornment] = useState<adornmentTypes>("");
const [endAdornment, setEndAdornment] = useState<adornmentTypes>("");
const [error, seterror] = useState<error>(false);

<Input
  id={id}
  value={value}
  onChange={_onChange} //have a method
  onBlur={_onBlur} //have a method
  onFocus={_handleFocus} //have a method
  startAdornment={startAdornment} //have switch cases on special character $,% etc
  endAdornment={endAdornment}
  error={error} />

现在根据材料文档错误 - bool - 如果为真，则输入将指示错误。这通常是通过表单控件的上下文获得的。

对于伪类<代码>错误-。如果error={true}，则Mui-error -应用于根元素的伪类。

现在我无法使用错误状态为true，因为值类型描述为字符串！

我错过了什么？请帮忙！

Answer 1

我们可以从Input API的Mess-UI文档中看到

道具：错误

类型：bool
说明：如果为true，输入将指示错误。

对于css:错误

全局类:< code >。Mui-error
描述:如果error={true}，则伪类应用于根元素。

它们是两个不同的东西，我们可以像下面这样使用它们:

<Input
  ...
  error={errorFlag}
  classes={{error: classes.errorStyleClass}}
/>

如果 props 错误的值为 true，则将应用 CSS 错误的样式。

这就是这类东西的概念。由于没有更多的信息，我们可以从帖子中得到，如果有进一步的问题，请更新。