fetch网络请求封装示例详解
2021-11-28 04:06
585 查看
export default ({ url, method = 'GET', data = null, }) => { // 请求配置 let options = { method } // data不为空时,它就是post请求 if (data) { options = { ...options, body: JSON.stringify(data), headers: { 'content-type': 'application/json' } } } return fetch(url, options) .then(res => res.json()) .then(data => data) }
使用
get
post
<script type="module"> import fetchApi from './js/fetch.js' const vm = new Vue({ el: '#app', data: { users: [] }, // 发起网络请求 mounted() { let url = 'http://localhost:3000/api/users' // fetchApi({ url }).then(data => console.log(data)) fetchApi({ url, method: 'POST', data: { id: 200, name: 'aaa' } }).then(data => console.log(data)) } }) </script>
以上就是fetch网络请求封装示例详解的详细内容,更多关于fetch网络请求封装的资料请关注脚本之家其它相关文章!
您可能感兴趣的文章:相关文章推荐
- Android Xutils3网络请求的封装详解及实例代码
- vue项目中axios请求网络接口封装的示例代码
- React Native中的网络请求fetch和简单封装
- React Native中的网络请求fetch和简单封装
- React Native 使用Fetch发送网络请求的示例代码
- React Native网络请求fetch简单封装
- 详解微信小程序网络请求接口封装实例
- react native 使用fetch进行网络请求(https),解决SSLHandshake问题,以及怎样进行二次封装
- 微信小程序网络请求封装示例
- [置顶] React Native 网络请求封装:使用Promise封装fetch请求
- retrofit+RxJava+okhttp简便封装实现网络请求(详解)
- Flutter 网络请求框架封装详解
- 微信小程序之网络请求简单封装实例详解
- ReactNative 封装fetch网络请求
- Swift利用AFN实现封装网络请求详解
- AFN 中 封装网络请求源码示例
- React Native中的网络请求fetch和简单封装
- 详解React Native网络请求fetch简单封装
- ReactJs中的网络请求fetch 使用及封装
- 详解flutter之网络请求dio,请求,拦截器简单示例