您收到的错误信息不是material-ui，而是浏览器处理错误的信息。由于浏览器根据“required”属性呈现此信息，因此无法更改此信息。您只能通过对表单执行自定义错误处理来更改此信息。

下面是我在我的个人项目中使用的代码片段：

<TextField
               error={this.props.error_val
                    ? true
                    : false
                }
                required={this.props.isRequired ? true : false}
                type={this.props.type}
                label={this.props.label}
                variant={this.props.VARIANT}
                className={classes.root}
/>

可以使用required和error属性组合来决定是否填充输入。
其次，您可以编写一个validate()，它基本上是一个switch语句，您将在其中传递"标签名称"、"值"，并将返回值放入<TextField/>组件。
片段：

validate = (name, value) => {
        let error = "";
        switch (name) {
          case "name":
            error = (!value || value.length == 0) && "Please enter the name";
            break;
    }
            return error;
}

可以将TextField组件的“必需”验证消息替换为自定义验证消息（提交表单时），如下所示：

<TextField
        onInvalid={() => {
          document
            .getElementById("business-email-textfield")
            .setCustomValidity("Please type a valid email address");
        }}
        required
        id="business-email-textfield"
        label="Business Email"
        name="email"
        onChange={handleInput}
        variant="standard"
      />

当然，在handleInput函数中，您应该处理输入，但是您还应该重置自定义验证消息。

const [formInput, setFormInput] = useReducer(
      (state, newState) => ({ ...state, ...newState }),
    {
        email: "",
        businessType: "",
    }
  );

  const handleInput = (evt) => {
    const name = evt.target.name;
    const newValue = evt.target.value;
    setFormInput({ [name]: newValue });
    //the line below clears the custom-validatio message
    document.getElementById(evt.target.id).setCustomValidity("");
  };