如何在视觉上区分只读文本字段?

Mai*_*rez 4 javascript reactjs material-ui

我正在使用 Material-UI 库来制作表单。但我不知道如何区分我的文本字段处于只读或编辑模式时。看起来一样。我希望用户注意到他何时以这种或另一种方式。提前致谢。

          <TextField
            inputProps={{
              readOnly: Boolean(readOnly),
              disabled: Boolean(readOnly),
            }}
            required
            fullWidth
            name="first_name"
            type="text"
            label="First Name"
            value={first_name || ''}
            onChange={this.handleChange}
          />
Run Code Online (Sandbox Code Playgroud)

小智 7

聚会有点晚了,当时该选项可能不存在,但您可以传递“disableUnderline”属性并将其设置为“true”,而不是将输入设置为“禁用”。

<TextField InputProps={{readOnly: true, disableUnderline: true}}/>
Run Code Online (Sandbox Code Playgroud)