在移动设备上输入时，如何让React TextField打开数字键盘？

Question

我有一个React TextField，它接受用户输入，它代表一个日期。当用户点击该字段时，我希望打开数字键盘而不是完整的字母。我正在查看React docs here并试图模仿他们的例子。

我的TextField如下所示：

  <TextField
    { ...materialConfiguration }
    floatingLabelFixed={value.length > 0}
    floatingLabelText={label}
    errorText={errorText}
    onChange={this.onChange}
    onKeyUp={this.debouncedOnKeyUp}
    onBlur={this.onBlur}
    type="number"
    label="Number"
    id="standard-number"
    >
    <Cleave value={value} options={{date: true, datePattern: ['m', 'd', 'Y']}} />
  </TextField>

我在React示例中添加了type label和id字段，这些字段使得键盘发生了变化，但它不起作用。如何获取此输入以打开数字键盘？

React的例子如下：

<TextField
  id="standard-number"
  label="Number"
  value={this.state.age}
  onChange={this.handleChange('age')}
  type="number"
  className={classes.textField}
  InputLabelProps={{
    shrink: true,
  }}
  margin="normal"
/>

谢谢

Answer 1

您必须将此属性添加到输入标记：

<input type='number' inputMode='numeric' pattern="[0-9]*" />