リアクトでバックエンドのインターフェースをどのように呼び出すか
ReactでバックエンドAPIを呼び出すには、fetchやaxiosなどのライブラリを使用できます。例を以下に示します。
- バックエンドのインターフェイスを、fetchメソッドを使用して呼び出す:
fetch('/api/data') // 接口地址
.then(response => response.json()) // 将响应的数据转为JSON格式
.then(data => {
// 在这里处理接口返回的数据
console.log(data);
})
.catch(error => {
// 处理错误
console.error(error);
});
- Axiosライブラリを用いてバックエンドAPIを呼び出す:
npmでaxiosライブラリをインストールする必要があります。
npm install axios
次に、このaxiosを用いて、次のような形でバックエンドのインターフェースを呼び出すことができます。
import axios from 'axios';
axios.get('/api/data') // GET请求的接口地址
.then(response => {
// 在这里处理接口返回的数据
console.log(response.data);
})
.catch(error => {
// 处理错误
console.error(error);
});
上記のコードの「/api/data」は、サンプルのインタフェースアドレスです。実際の状況に合わせて、ご自身がバックエンドのインタフェースアドレスと置き換える必要があります。