javascript - 在 React js 的 TextField 中放置长度约束

Question

我正在接受卡号用户的输入，并希望用户输入的长度不能小于和大于 12。这是我的文本字段的声明。

<TextField
    id="SigninTextfield"
    label="Aadhaar number"
    id="Aadhar"
    lineDirection="center"
    required={true}
    type="number"
    maxLength={12}
    style={styles.rootstyle}
    erorText="Please enter only 12 digits number"
/>

现在我不明白是否使用 javascript 或任何事件处理程序来限制长度。

Answer 1

您可以设置maxLength 属性来限制文本框中的文本。

您可以将 maxLength 传递给 inputProps(小写 i，不是 InputProps)，而不是 onChange 方法material-ui TextField 的 Prop 。

<TextField
    required
    id="required"
    label="Required"
    defaultValue="Hello World"
    inputProps={{ maxLength: 12 }}
/>

基本上我们可以通过inputProps对象编辑所有输入元素的原生属性。

链接到 TextField接口(interface)