前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >react-native 开发笔记 (三)

react-native 开发笔记 (三)

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

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
      • 多个路由页面之间的通信
        • 文件上传
        相关产品与服务
        图片处理
        图片处理(Image Processing,IP)是由腾讯云数据万象提供的丰富的图片处理服务,广泛应用于腾讯内部各产品。支持对腾讯云对象存储 COS 或第三方源的图片进行处理,提供基础处理能力(图片裁剪、转格式、缩放、打水印等)、图片瘦身能力(Guetzli 压缩、AVIF 转码压缩)、盲水印版权保护能力,同时支持先进的图像 AI 功能(图像增强、图像标签、图像评分、图像修复、商品抠图等),满足多种业务场景下的图片处理需求。
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档