javascript - 从大纲输入材料 ui 中删除默认可见性图标

Question

我想从大纲输入材料 ui 中删除默认可见性图标。当输入类型是密码时，会显示一个默认的可见性图标。我想删除它。我正在使用 inputAdorment 自定义可见性图标。

这是我的代码..

 <FormControl variant="outlined">
                          <InputLabel htmlFor="outlined-adornment-password">
                            What’s your current password?
                          </InputLabel>
                          <OutlinedInput
                            id="outlined-adornment-password"
                            type={showCurrentPsw ? 'text' : 'password'}
                            value={currentPassword}
                            name="currentpsw"
                            onChange={({ target: { value } }) => {
                              setCurrentPassword(value);
                              value !== '' &&
                                value.trim() !== '' &&
                                setCurrentPswdEmpty(false);
                            }}
                            error={currentPswdEmpty}
                            label="What’s your current password?"
                            required
                            endAdornment={
                              <InputAdornment position="end">
                                <IconButton
                                  aria-label="What’s your current password?"
                                  onClick={() => {
                                    setShowCurrentPsw(!showCurrentPsw);
                                  }}
                                  edge="end"
                                >
                                  {showCurrentPsw ? (
                                    <Visibility />
                                  ) : (
                                    <VisibilityOff />
                                  )}
                                </IconButton>
                              </InputAdornment>
                            }
                          />
                        </FormControl>

标签： javascriptreactjsmaterial-ui

Answer 1

它通过使用下面的css解决了。parentclassname => 父元素的类名。这是一个反应项目。

.parentclassname input[type='password']::-ms-reveal,
.parentclassname input[type='password']::-ms-clear {
  display: none;
}