使用reactjs提交表单后清除所有表单输入框答案

【问题标题】：clear all form input box after submit form using reactjs使用reactjs提交表单后清除所有表单输入框
【发布时间】：2021-08-03 00:43:21
【问题描述】：

提交数据后想清除所有输入框表单

这是我的代码：

function GSetup() {
        
        const [gName, setGName] = useState("");
    
        const dispatch = useDispatch();
        
          useEffect(() => {
            dispatch(getGNames());
          }, [dispatch]);
        
          const onSubmitHandler = (e) => {
            e.preventDefault();
        
            dispatch(
              addGName(
                { 
                  gn_name: gName, 
                  su_id: userInfo._id 
                }
               
              )
            );
          };
        return (  );
}

我在onSubmitHandler 函数上使用了这个setState，但它不起作用

this.setState({
      gn_name: ''
    });

【问题讨论】：

您需要使用setGName('') 。您正在使用钩子作为状态句柄，因此您需要使用 setGName 来更新 gName 状态。
是的，它有效，我想念这些而不是 setState。谢谢@monesulhaque

标签： reactjs forms tailwind-css

【解决方案1】：

试试这个方法

function GSetup() {
        
  const [gName, setGName] = useState("");

  const dispatch = useDispatch();
  
    useEffect(() => {
      dispatch(getGNames());
    }, [dispatch]);
  
    const onSubmitHandler = (e) => {
      e.preventDefault();
  
      dispatch(
        addGName(
          { 
            gn_name: gName, 
            su_id: userInfo._id 
          }
         
        )
      );
      setGName('')   
    };


  return (  );
}

this.setState({}) 在classComponent 之外不起作用

【讨论】：