React Native專案實戰之fetch請求

2021-08-02 05:32:05 字數 960 閱讀 8757

摘要: fetch簡介 在 ajax 時代,進行請求 api 等網路請求都是通過xmlhttprequest 或者封裝後的框架進行網路請求。而在前端快速發展地過程中,為了契合更好的設計模式,產生了 fetch 框架。

在 chrome 瀏覽器中已經全域性支援了 fetch 函式,開啟除錯工具,在 console 中可以進行體驗下fetch。先不考慮跨域請求的使用方法,我們先請求同域的資源。例如:

fetch("").then(function

(response))

使用 fetch 的建構函式請求資料後,返回乙個 promise 物件,然後根據具體的實際情況處理。

fetch("")  

.then(function

(response))

說明,在請求後的 response 中,常常有如下返回情況:

1.使用get方式進行網路請求,例如:

fetch('', ).then(function

(response) ).catch(function

(err) );

2.使用post方式進行網路請求,例如:

let param = ;

fetch(url, ).then(function(response) );

3.其它寫法,例如:

try ).then(function(response) );  

} catch(e)

4.帶header 或其它引數,例如:

fetch(url, ,

body: json

.stringify()

})

fetch請求並填充介面

React Native專案實戰之fetch請求

在 chrome 瀏覽器中已經全域性支援了 fetch 函式,開啟除錯工具,在 console 中可以進行體驗下fetch。先不考慮跨域請求的使用方法,我們先請求同域的資源。例如 fetch then function response 使用 fetch 的建構函式請求資料後,返回乙個 promis...

React Native 之 專案實戰 五

可以酌情 文中內容因各人理解不同,可能會有所偏差,歡迎朋友們聯絡我討論。本章許多內容本來是要放到後面講的,考慮到有朋友可能不需要了解redux 中當我們點選首頁和海淘2個item時,會馬上獲取最新資料個數然後進行更新,這邊來實現一下這個功能。通過通知的方式監聽item點選做相應的操作,所以我們在需要...

React Native布局實戰

前輩教導我們,掌握一門新技術的最快方法是練習。因此,我找了下比較有愛,暖氣的介面。當然不是給美團打廣告了,只是覺得頁面蠻清新的。下面就是要顯示的效果 第三篇文章基本上對react native的布局基本上有個大致的認識,現在開工吧。總體上,該頁面分三個部分 1 我們約會吧及其右邊3欄 2 1元吃大餐...