时间戳

首页 > 解决方案 > 根据函数结果禁用按钮

javascript - 根据函数结果禁用按钮

问题描述

如果函数返回 false，则必须禁用一个按钮。每当输入中的某些内容发生变化时，都应该调用此函数，因为该函数会检查引入的字符串是否是有效的电子邮件。

<button onClick={() => saveChanges()} disabled={() => checkChanges()}>click me</button>

const checkChanges = () => {
   // takes email value from state
   // checks if it's valid
   return valid; // it's either true or false
}

它不起作用，禁用它是否有问题以及它是如何编写的？

标签： javascriptreactjsbuttonecmascript-6onclick

解决方案

您可以在调用后使用useState变量并为其设置结果checkChanges()


const [valid, setValid] = useState(false);

const checkChanges = () => {
   // takes email value from state
   // checks if it's valid
   return setValid(result) // true or false after validating
}

 
return (<button onClick={() => saveChanges()} disabled={!valid}>click me</button>) {/* disable if not valid*/}

推荐阅读