首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >react-native 开发笔记 (三)

react-native 开发笔记 (三)

作者头像
frontoldman
发布2019-09-02 17:31:23
发布2019-09-02 17:31:23
8510
举报
文章被收录于专栏:樯橹代码樯橹代码

react-native 开发笔记

es7 async

react native默认编译配置可以编译一部分es7语法的,async await是其中的一种。使用起来自然是很简单,和koa 1.x 基本一致,没有区别。

多个路由页面之间的通信

有这样子一种场景

  1. 用户进来,显示未登录的首页
  2. 用户点击去登录,进入登录页面
  3. 登录成功,跳转回首页,这时候要重新加载首页的信息,那怎么通知首页更新呢

react-native自带了RCTDeviceEventEmitter模块,用来做事件通信的。这个模块的设计思想和nodejs的event模块类似。

需要注意的是,此模块只需要引入一次放置到一个文件里,然后其他模块通通引入这个文件,才可以通信。不能每个文件都引入这个模块,那样子就是单独的事件实例,无法进行通信。

文件上传

比如用户需要修改头像,这时候就会用到摄像头和选择图片,社区有现成的模块可以使用 使用到的组件:

代码语言:javascript
复制
react-native-image-picker:调用摄像头和选取图片
react-native-image-resizer:图片压缩模块

get到一个技能点就是,formData的使用。是的react-native里面也集成了这个方法

formData可以附加文件,以前在web上,我只是使用了file获取的文件,直接append进去。

今天得到一个新技能

代码语言:javascript
复制
let formData = new FormData()
formData.append('avatar', {uri: resizedImagePath, name: response.fileName, type: 'multipart/form-data'})

其实append的第二个参数就是一个File实例,根据file.type可以决定很多东西

如果是 multipart/form-data,uri就可以是一个图片路径 如果是 image/jpeg,uri可以是一个图片的base64编码字符串

可能还有一些其他的功能,待研究

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • react-native 开发笔记
    • es7 async
    • 多个路由页面之间的通信
    • 文件上传
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档