各位使用 react 时,怎么处理表单提交?
发布于 3 年前 作者 daGaiGuanYu 3125 次浏览 来自 问答

如果给 input 绑定 onChange 事件,感觉会产生非常多重复代码
或者使用 dom 去取 form 里的值,也挺麻烦的

10 回复
它带来便利性远比它带来的复杂度低得多

是不是有点怀念jquery

  var data = {};
    $($("#myForm").serializeArray()).each(function () {
     balabala 
 
    $.ajax({
        type: "POST",   
        url: "http://xx.xx.xx.xx/api/save",  
        data: JSON.stringify(data),
        async: false, 
        dataType:"json",
        contentType:"application/json",
        error: function (request) {   
            alert("Connection error");
        },
        success: function (data) { 
            alert(data);  
        }
    });

}

往好的点上看,代码规范,更适合大规模开发的。

这个时候你可能需要angular 和 vue

还是vue香🐶

看来 你对react还是不熟练啊

可以把 input 作为一个组件,在组件中监听事件,在你需要用 form 表单的地方引入 input 组件,这样就不用每个 input 去处理一次了

我上去就是一个 import { Form, Input, Button, Checkbox } from ‘antd’; 简单有效

react vue 这类框架在处理表单上的默认例子, 比较繁琐, 竟然是单独存储

react 有个 https://react-hook-form.com/, 能尽可能充分利用原生html form的特性处理表单, 能简洁一些

@netwjx 哇,这个棒,谢谢

回到顶部