react如何判断input框有值时禁用

在React中，你可以使用状态来判断input框是否有值，并根据其值来禁用或启用其他元素。

首先，在你的组件中定义一个状态来保存框的值，可以useState钩子函数来创建状态：

 React, { useState } from 'react';

function MyComponent() {
  const [inputValue setInputValue] = useState('');

  // 处理input框的值改变事件
  const handleInputChange = (event) => {
    setInputValue(event.target.value);
  };

  return (
    <div>
      <input type="text" value={inputValue} onChange={handleInputChange} />
      <button disabled={!inputValue}>提交</button>
    </div>
  );
}

export default MyComponent;

在上面的例子中，我们使用useState创建了一个名为inputValue的状态，并将其初始值设置为空字符串。然后，我们定义了一个handleInputChange函数来处理input框的值改变事件，该函数将输入框的值更新到inputValue状态中。

在render方法中，我们将input框的值绑定到inputValue状态，并将handleInputChange函数传递给onChange事件处理程序。然后，我们使用disabled属性来禁用按钮，当inputValue为空时，按钮将被禁用。

这样，当input框的值发生变化时，按钮的禁用状态将根据inputValue的值进行更新。