如何创建一个表单，该表单仅在输入不为空且>为 0 时才允许提交？

Question

我想在提交之前制定一个逻辑，声明输入值不应该是任何空值，并且应该大于0。

const minValue = (input) => {
if(input < 0){
alert('input has to be greater than 0')
}else{
return input;
}
}    

<Form className  = "workout-form">
<div className ="form-row">
<label className ="form__label">Distance</label>
<input type = 'number' value = {distance}  min = '0' onChange = {(e) => setDistance(minValue(e.target.value))} className ="form__input form__input--distance" placeholder="mi"  autoFocus required/>
</div>
<button className ="form-btn" onClick = {submitWorkout}>Add Workout</button>
</Form>

Answer 1

如果此代码适用于检查负值，您应该能够将If(input<0(更改为If((input&llt；0(||(input！="(

Answer 2

const handleChange = e => {
const value = parseInt(e.target.value);
if(!isNaN(value) && value > 1){
setDistance(value)
}
}

onChange={handleChange}