一:简单参数

简单的参数,我们可以使用手动拼接的方式传递。

格式为:

fetch(url?key1=val1&key2=val2&...).then((response) => response.json())
.then((json) => {
//处理返回值
}).catch((error) => {
//异常处理
})

二:POST方法传递数据,在fetch方法的参数中定义post方法的参数们:method、headers、body

fetch(url', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
firstParam: 'yourValue',
secondParam: 'secondValue',
})
})

三:复杂表单数据的传递,比如图片等

我们可以自己new一个FormData,直接传给body,在FormData中传递字节流实现上传图片的功能。

let formData = new FormData();
formData.append("key",表单内容); fetch(url , {
method: 'POST',
headers: {},
body: formData,
).then((response) => {
if (response.ok) {
return response.json();
}
).then((json) => {
alert(JSON.stringify(json));
).catch((error) => {
console.error(error);
);

ReactNative踩坑日志——fetch如何向服务器传递参数的更多相关文章

  1. ReactNative踩坑日志——使用async/await语法解决网络请求的异步导致的指令执行顺序错乱问题

    转载请注明原文地址: ReactNative的fetch是天然的异步请求,因此,如果你在一个代码块中使用了fetch,那么在执行的时候程序不会等待网络响应结束才执行下一条代码,而是会直接按顺序执行完整 ...

  2. ReactNative踩坑日志——OnPress随着render()执行被自动调用?

    在ReactNative中,Text.Button以及其他Touchable包装成的可点击控件,都可以通过onPress属性为其指定点击时的响应函数. 在有些情况下,我们会把这些点击函数先定义好,然后 ...

  3. ReactNative踩坑日志——代码执行方式(面向对象)

    在ReactNative中,是以面向对象的方式执行代码的.处于同一{}內的代码以对象的形式执行,也就是说,程序虽然会自上而下执行代码,但是它会保证当前整个代码块內的语句执行完毕才执行下一代码块. 举个 ...

  4. ReactNative踩坑日志——如何实现删除scrollview中的视图

    在reactNative中,页面是根据state值的变化来重新渲染的.因此,传统的前端开发中通过 id 来移除一个页面元素的做法在这里不适用. 一般,我们是通过遍历数组或map来渲染出scrollvi ...

  5. ReactNative踩坑日志——函数绑定this

    ES6语法定义的函数没有自动绑定this,所以在函数中使用了 this.xxx 就会报错,因为没有把类实例等this传进函数中. 有两种方法绑定this: 法1:在构造函数中为其他函数绑定this c ...

  6. ReactNative踩坑日志——页面跳转之——Undefined is not an Object(evaluating this2.props.navigation.navigate)

    页面跳转时,报  Undefined is not an Object(evaluating this2.props.navigation.navigate) 出错原因:在一个页面组件中调用了另一个组 ...

  7. react-native 踩坑记

    最近在使用react-native的时候遇到了很多坑,这里给大家分享下 一.样式 react-native 虽然支持flex布局,但是所有的样式均是css样式的一个很小的集合,尤其是在安卓机下问题尤为 ...

  8. React-Native 踩坑过程

    踩坑过程: 解决方法就是去 SDK Manager 把 23.0.1 的版本下载了 而如果报错信息中含有bintray.com.gradle.org等网址,请***,反复重试,或者去react nat ...

  9. ReactNative 踩坑小计

    使用ES6語法編寫Component時綁定事件需要用this.MethodName.bind(this),否則MethodName中無法使用this <TouchableHighlight on ...

随机推荐

  1. mysql 比较函数和操作符

    MYSQL之中的比较函数和操作符: 1.[NOT] BETWEEN ... AND ...  Check whether a value is within a range of values 说明: ...

  2. 美国罪案故事第一季/全集American Crime Story迅雷下载

    英文全名American Crime Story,第1季(2016)FX.本季看点:<美国罪案故事>以律师们的视角看待辛普森谋杀案. 本剧探索了案件背后各种混乱,以及案件双方的庭审策略,也 ...

  3. 通过Gson解析Json数据

    Json是一种数据格式,便于数据传输.存储.交换:Gson是一种组件库,可以把java对象数据转换成json数据格式. gson.jar的下载地址:http://search.maven.org/#s ...

  4. 开源项目PullToRefresh详解(三)——PullToRefreshScrollView

    和前几篇文章一样,这里还是先设置布局文件,然后找到这个控件.只不过这里要简单很多. 1.布局文件 <?xml version="1.0" encoding="utf ...

  5. Orchard 前台权限与自定义权限

    一:关于前台权限 1:只允许自己看到 首先,我们需要确定在 Role 设置页面,用户所对应的 View Page by others 和 View all content 未被选中.备注,我们首先和得 ...

  6. Windows10更新后,远程桌面无法登录服务器 提示远程桌面协议 CredSSP 出现漏洞

    Win10远程桌面 出现 身份验证错误,要求的函数不受支持,这可能是由于CredSSP加密Oracle修正 解决方法 打开注册表,手动建立 这个路径 HKEY_LOCAL_MACHINE\SOFTWA ...

  7. Guava CompoundOrdering

    概述 CompoundOrdering是Ordering的子类,它用来存储比较器链, Ordering的compound()内部实现就是使用 CompoundOrdering(Comparator&l ...

  8. linux下使用ack进行代码搜索

    1.安装 wget http://beyondgrep.com/ack-2.12-single-file sudo mv ack-2.12-single-file /usr/bin/ack sudo ...

  9. 深入浅出Nodejs读书笔记

    深入浅出Nodejs读书笔记 转:http://tw93.github.io/2015-03-01/shen-ru-qian-chu-nodejs-reading-mind-map.html cate ...

  10. CSS 中的字体兼容写法:用CSS为英文和中文字体分别设置不同的字体

    font-family的调用方法: font-family:Arial,'Times New Roman','Microsoft YaHei',SimHei; font:bold 12px/.75em ...