axios.getとaxios.postの再利用可能なコンポーネントを書き込む方法は？

Question

私はほとんど反応し、JavaScriptを、フロントエンドの開発に焦点を当てた学生です。私は今問題になった、私は斧を使用していますが、将来的にはより柔軟な斧のような他のライブラリがあります。私はアクションクリエイターのたびにアクシオスコールを書いてもうんざりです。 APIメソッドの再利用可能なコンポーネントを書きたいと思っています。私のレデューサーファイルにドラッグして使用できます。私がそれを変更したいときは、すべてのコンポーネントを変更する必要はありませんaxios.get。

import Axios from 'axios' 


export function GetApiData() { 
     return function() { 
      Axios.get('/api').then(response=>{ 
       console.log(response.data); 
      }); 
     } 
    } 

私は、本番環境で企業がこのようなシナリオを動作するように、再利用可能なコンポーネントを使用することを聞いたことがあります。

import {get, post} from 'some file' 

// code using get or post to make an axios call 

、それらがAxios.getのために代わりにgetを使用：私は、再利用可能なコンポーネント、このような何かを探しています。私は再利用可能なコンポーネントを作成することに悪いです。あなたのsrcフォルダ内

Answer 1

あなたが好きな名前のフォルダを作成し、その中に任意の名前、別のjsファイルを作成することができますlike.Afterこと、これはあなたが
注意を望むものである場合this.checkような何かを実行します。スニペットはrun.thisしません、それはあなたがどんな問題が

を発生した場合、それit.Use使用して、私に教えてほしいどこにそのインポートした後にのみ、デモ

const Client={ 
 
    login:(phone,key)=>{ 
 
     //here change it to your desired function like axios.get or anything 
 
     return fetch(
 
      `https://example.com/api/account/login`, 
 
      { 
 
       method:'POST', 
 
       accept:'application/json', 
 
      } 
 
     ).then((response)=>response.json()); 
 
    }, 
 
    //write bunch of methods like the above 
 

 
} 
 

 

 

 
export default Client;

のためであります

あなたは

import Client from "yourfoldername/filename"; 


//call to client 
// i believe your api call returns a promise 
Client.login(parameters).then((res)=>{ 
     //do something here 
    } 
).catch(err=>{ 
    //do something here 
})