データを投稿する

Question

私は、JavaScriptとReactの新しいランク、つまり質問です。 コンポーネントの内部からデータを送信する必要があります。 私はPOST用のフェッチAPIを使用しています。これは私のコードです。

export function postData(url, sender, media){ 
    return fetch(url, { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json'}, 
         credentials: 'include', 
         method: 'POST', 
         body: JSON.stringify({sender: sender, media: media}) 
    }) 
    .then((response) => { return response.json() ;}) 
    .catch((error) =>{ console.log("Request failed: ", error) ;}) 

} 

私のコンポーネントには、子コンポーネントのコールバックから投稿する予定の値を取得する2つのメソッドがあります。

class MyComponent extends React.Component{ 

.......... 
handleClick(sender){ 
    console.log(data); 

    } 

    handleSubmit(media){ 
    console.log(data); 
    } 
...... 
render(){ 
...... 
passing down handleSubmit and handleClick as props to child 
    } 
} 

どのように、どこのコンポーネントで、私は私のpostDataメソッドを呼び出すか、どのように私はsenderとmediaを渡します。

Answer 1

まあ、clickとは別々のイベントなので、両方を渡したい場合は、少し違った方法で設計する必要があります。あなたがMyComponentファイルの先頭に...

import { postData } from foo; 

に持っているよう

は限りpostDataの呼び出しと、それが見えますので、機能が利用可能になります。 postDataが正しくインポートされたら、イベントハンドラ関数内で使用できます。

私はちょうどあなたのfetchをスキミングしましたが、それはうまくいくか、少なくともデバッグは簡単であるようです。

---

要約：あなたが引数としてmediaとsenderを渡される1つのイベントハンドラを、持っているので、それを修正します。次に、postDataをインポートし、ハンドラで呼び出します。