在选择强密码之前如何不发送信息？

Question

我已经使用了 PasswordStrengthBar 。在输入强密码之前，我如何检查请求是否未发送...事实上，如果密码很弱 我使用 useform..

<Grid container className={classes.inputItem}>
  <Grid item>
    <Input
      name="newPassword"
      type={state.new ? "text" : "password"}
      inputClassName={classes.Input}
      ref={register({ required: true })}
      error={!!errors.newPassword}
      endAdornment={
        <PasswordAdornment
          onClick={(visible) => dispatch({ field: "new", visible })}
        />
      }
    />
    <PasswordStrengthBar
      name="PasswordStrength"
      password={watch("newPassword")}
      minLength={6}
      barColors={barColors}
      scoreWordClassName={classes.scoreWordClassName}
    />
  </Grid>
</Grid>

Answer 1

react-password-strength-bar component has an onChangeScore 道具

您可以添加类似

的内容

<PasswordStrengthBar
    name="PasswordStrength"
    ...
    onChangeScore={(score) => setCanSubmit(score >= 4)}
/>

或类似的（取决于您管理状态的方式）。显然，您首先要将 canSubmit 标志设置为 false，这样人们就需要输入密码。