reactjs 使用伪模式故意使html5表单验证程序无效

0md85ypi 于 2022-11-04 发布在 React

关注(0)|答案(1)|浏览(139)

如果满足特定条件，我想通过编程将输入设置为无效，例如
isValid
让我们以变量isValid为例，如果它是false，我希望这个气泡显示默认的浏览器气泡（onsubmit）和提供的自定义错误。

<input 
    type="text" 
    required 
    oninvalid="this.setCustomValidity('Please Enter valid name')"
    oninput="setCustomValidity('')" 
/>

然而，这只检查它是否为空，额外的验证来自一个名为pattern的字段，然而，该正则表达式，所以我想也许做一个几乎所有情况下的正则表达式时，是'isValid == true'否则，一个正则表达式，将下降，每次例如（React）

<input 
    type="text" 
    required
    pattern={isValid ? 'regex valid always' : 'regex fail always'}
    ...
/>

这能行吗，还有更好的办法吗？

1条答案

感谢@revo的帮助，让它可以与以下各项一起工作：

<input 
    type="text" 
    required
    pattern={isValid ? null : '(?!)'}
    ...
/>