すべての動的状態をJSONに送信

Question

私はReactJSを使用してユーザーが動的にフォームを生成し、そのフォームデータを保存できるようにしています。例えば、3つの要素（テキストエリア、選択フィールド、テキストフィールド）を持つフォームを持つことができます。彼らは彼らが何を望んでいてもそれを入力して値を入力します。これらのフィールドのタイトルと値は、状態として動的に保存されます。

setState({ [name]: value}). 

これは問題なく動作します。今、これらの州をすべてJSONに変換し、Ajax経由で送信したいと考えています。しかし、私は、ユーザーがそれらの状態を題したかわからないので、私は次のことをやってみました：

JSON.stringify({ 
    "data": this.state 
}) 

しかし、これは「JSONに円形構造を変換する」エラーがスローされます、私はこのために推測しています。状態には、オブジェクトデータも含まれます。

実際にすべての州の名前がわかっていなくても、すべての州をAjax経由で送信する方法はありますか？

Answer 1

あなたフォームでさえObject.keysで名前を知らない状態をループ（）

Object.keys(this.state).map((name) => { 
    console.log(this.state[name]); 
}); 

Answer 2

はフォームのためのFormDataを使用して、フォームオブジェクトを作成して提出することができ、それは以下のようにフォーム内のすべての値を掲載します

handleSubmit(event) { 
    event.preventDefault(); 
    const data = new FormData(event.target); 
    // Assuming you are using fetch 
    fetch('url', { 
     method: 'POST', 
     body: data, 
    }); 
}