Reactjs React JS中的简单表单

我刚开始学反应。我创建了一个简单的表单。现在我想登录控制台。但它给出了一个错误

以下是错误的图像：

同时附上我的代码：

从“React”导入React；
功能注册表（道具）{
函数handleSubmit（）{
log（“内部句柄提交”）；
}
返回(
添加任务
提交
)
}
出口违约登记表；

这与您的表单无关，但与chrome有关，因为它现在允许源地图

由于html文件没有直接链接到各个JS文件，因此需要一个源映射才能显示日志的来源。React项目默认情况下没有源映射，因此我建议您关闭源映射，这意味着您在控制台中看不到日志从何处提交，但React会为您执行此操作

---

线程上的第一个解决方案很好地解释了如何关闭soucemaps。

首先，如果尚未安装react-dev工具扩展，我们应该为您的浏览器安装它

您应该调用submit函数prevenDefault方法来防止刷新页面。 并使用按钮类型提交到您的提交按钮

从“React”导入React；
功能注册表（道具）{
函数handleSubmit（e）{
e、 预防默认值（）
log（“内部句柄提交”）；
}
返回(
添加任务
提交
)
}
出口违约登记表；

我仍然收到这个错误；未捕获（承诺中）无法建立连接。接收端不存在。我仍然收到此错误；未捕获（承诺中）无法建立连接。接收端不存在。您使用的是哪种浏览器？我使用的是chrome我使用的是edge浏览器而不是chrome。它工作正常。谢谢。

import React from 'react';

function RegistrationForm(props){

function handleSubmit(e){
        e.preventDefault()
         console.log('Inside handle Submit');
}

return(
    <form onSubmit={handleSubmit}>
        <div className="form-group">
            <label htmlFor="task">Add task</label>
            <input id="task" className="form-control"/>
        </div>

        <button type="submit" className="btn btn-primary">Submit</button>
    </form>
)
}

export default RegistrationForm;