最好的方法來處理輸入字段的變化怪異的形式

Question

我正在開發一個Web應用程序，有一個表單有太多的輸入字段（約20），每一個變化都必須保存（我認爲使用Socket.IO來通知我的後端實時保存所有更改），但處理多個onChange事件看起來不太清楚。我很想知道是否有人有類似的問題，以及如何使用更好的方法來解決問題。

Answer 1

您可以附加onChange事件到form而不是對事件冒泡：

var Hello = React.createClass({ 
    onChange: function(e) { 
    console.log(e.target.value); 
    }, 
    render: function() { 
    return <form onChange={this.onChange}><input /><input /></form>; 
    } 
}); 

演示：https://jsfiddle.net/j178m3zL/

Answer 2

您確定要在每次更改時向服務器發送更改嗎？這是很多流量（實際上，很多連接），我相信你不想擁有這些流量。提交您的更改onBlur甚至onSubmit。這導致更好的表現！

Answer 3

所以你想要控制的表單字段。

看看https://facebook.github.io/react/docs/forms.html。

我會做下面的事情。

https://jsbin.com/bidiwob/edit?js,output