如果密码 !== "" && [已关闭]，则阻止表单提交

Question

如果

password !== &&

，我会尝试阻止表单提交。

如果密码不匹配或不符合标准，我有一个已经可以使用的表达式：

  const password = form.watch("password");
  const confirmPassword = form.watch("confirmPassword");

  const handleConfirmPasswordBlur = () => {
    setConfirmPasswordTouched(true);
  };

适用于此：

        <InputWithLabel
          id="password"
          label="Password:"
          placeholder={authFormConstants.placeholderPassword}
          type="password"
          register={form.register("password")}
          horizontal
        />
        {password !== "" && (
          <div className="col-start-2 col-span-3">
            <ValidationList rules={passwordRules} value={password} />
          </div>
        )}

但是，如果密码不等于空字符串以及提交表单时未输入任何密码，我希望显示相同的错误。

在普通的 JS 中，我通常会用这样的方法来处理它：

        document.getElementById("myForm").addEventListener("submit", function(event) {
            var password = document.getElementById("password").value;

            // Prevent form submission if password is not empty
            if (password !== "") {
                event.preventDefault();
                alert("Password must be empty to submit the form.");
            }
        });

但是，这对我来说不起作用。

Answer 1

在条件语句中添加括号将解决此错误。

{(password !== "") && (
  <div className="col-start-2 col-span-3">
    <ValidationList rules={passwordRules} value={password} />
  </div>
)}