從大綱輸入材料 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>

Answer 1

它通過使用下面的 css 解決。 parentclassname => class 父元素的名稱。 這是一個反應項目。

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