[英]disabled button not working properly in react
如果提供超过 10 个字符,则应禁用按钮,但当我们提供 <10 个字符时,应启用按钮不起作用
import React, { useState } from "react";
export default function DropDown() {
let [disable,setDisable]=useState(false)
function check(){
let inp=document.querySelector('input');
let btn=document.querySelector('button');
if(inp.value.length>10){
btn.disable=true
setDisable(true)
}else{
btn.disable=false;
setDisable(false)
}
}
return (
<>
<input disabled={setDisable} onKeyUp={check}/>
<button>click</button>
</>
);
}
只需将<input disabled={setDisable} onKeyUp={check}/>
更改为<input disabled={disable} onKeyUp={check}/>
import React, { useState } from 'react';
export default function App() {
const [disable, setDisable] = useState(false);
const check = ({target}) => {
if (target.value.length > 10) {
setDisable(true);
}
else {
setDisable(false);
}
}
return (
<>
<input disabled={disable} onKeyUp={(e) => check(e)} />
<button>click</button>
</>
);
}
如果你想禁用按钮只需添加
<button disabled={disable}>click</button>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.