为了账号安全,请及时绑定邮箱和手机立即绑定

需要两次按下的反应按钮

需要两次按下的反应按钮

慕丝7291255 2022-11-03 10:10:40
我当前的功能组件要求我在运行嵌套的 if 语句之前按两次按钮。根据我目前的理解,任何状态变化都会重新渲染整个组件,所以我相信这就是阻止 if 语句立即运行的原因。如果这是问题,我仍然不确定如何解决它。const [ inputData, setInputData ] = useState("Botany") // Example of stateconst [ lockInputData, setLockInputData ] = useState("")const [ prevLockInputData, setPrevLockInputData ] = useState("")// Button element propinputDataSubmit={ () => submitData(inputData) } // On button press this will be called.const submitData = async (inputData) => {setLockInputData(inputData);  if (lockInputData !== "" && lockInputData !== prevLockInputData) {    await newCat(inputData.replace(/[" "]/g, "_"));    setPrevLockInputData(lockInputData);  } else if (lockInputData !== "" && lockInputData === prevLockInputData) {    await newSubCat(inputData.replace(/[" "]/g, "_"));  }}使用 inputDataSubmit 的组件位:<form   onSubmit={ () => false}>  <input    action=""    type="text"    placeholder="Category"    value={props.inputData}    onChange={props.handleChange}   />          <button    type="button"     onClick={props.inputDataSubmit}  >  Random  </button></form>随时提供有关编码最佳实践的建议。
查看完整描述

1 回答

?
烙印99

TA贡献1829条经验 获得超13个赞

我认为因为setState可能是异步的(并且setLockInputData是 a setState)。


你可以试试:


const submitData = async (inputData) => {

  setLockInputData(inputData);


  if(inputData !== "") {

    if(inputData !== prevLockInputData) {

      await newCat(inputData.replace(/[" "]/g, "_"));

      setPrevLockInputData(inputData);

    }

    else

      await newSubCat(inputData.replace(/[" "]/g, "_"));

  }

}

希望这可以帮助。


查看完整回答
反对 回复 2022-11-03
  • 1 回答
  • 0 关注
  • 56 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信