【问题标题】:react-jsonschema-form onSubmit reloadreact-jsonschema-form onSubmit 重新加载
【发布时间】:2018-02-03 10:01:02
【问题描述】:

我正在使用react-jsonschema-form开发表单,无法执行onSubmit按钮对应的功能。我不明白为什么当我按下它时它会重新加载页面并且我不执行该功能。

const onSubmit = ({formData}) => console.log("Data submitted: ",  formData);

class QuestionsSet extends React.Component {

  render () {
    return (
      <section id="soyceliaco" className="section-padding text-justify">
        <div className="container">
          <div className="row">
            <div className="col-md-12">
              <h2 className="ser-title">Realizar cuestionario:</h2>
              <hr className="botm-line"></hr>
            </div>
            <div className="col-md-12 col-sm-12">
              <Form schema={schemaQuestions}
                    onSubmit={onSubmit} >
              </Form>
            </div>
          </div>
        </div>
      </section>
    );
  }
}

export default QuestionsSet;

【问题讨论】:

    标签: javascript forms reactjs


    【解决方案1】:

    你需要防止这样的默认操作

    const onSubmit = ({formData},e) =>{ e.preventDefault(); console.log("Data submitted: ",  formData)};
    

    有效,如果 onsubmit 生成一个“事件”

    【讨论】:

    • 感谢您的快速响应,但继续重新加载页面并且不执行功能:(
    • 是作为第二个或第一个参数生成的“事件”吗?
    • 我不知道。我只是按照 react-jsonschema-form 包的指南进行操作。 github.com/mozilla-services/react-jsonschema-form。表单提交 您可以传递一个函数作为表单组件的 onSubmit 属性,以监听表单何时提交且其数据有效。它将传递一个具有 formData 属性的结果对象,这是您通常需要的有效表单数据: render((
      ), document.getElementById("app"));
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-07-28
    • 1970-01-01
    • 1970-01-01
    • 2022-01-08
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多