开发一个基于React Native的简易demo--前记

不念不忘少年蓝@ 2022-06-04 06:57 399阅读 0赞

这阵子在学习react native， 说实话，**坑**真多！！！学习的过程也是不断的踩坑，艰难前进，这几天也断断续续的做了一个非常简单的demo.

**用到的技术**：

*  react native 样式、布局
 *  react-navigation
 *  轮播图
 *  react-native-video
 *  网络

**平台**：

**Android**、window系统 、Genymotion模拟器、vscode、已经配好的react native 环境

**准备条件**：

*  用于测试的网络json数据：[http://bbs.reactnative.cn/api/category/3][http_bbs.reactnative.cn_api_category_3]
 *  用于测试的mp4格式视频：[http://clips.vorwaerts-gmbh.de/big\_buck\_bunny.mp4][http_clips.vorwaerts-gmbh.de_big_buck_bunny.mp4]

**效果如下**：

![这里写图片描述][SouthEast]

![这里写图片描述][SouthEast 1]

![这里写图片描述][SouthEast 2]

![这里写图片描述][SouthEast 3]

#### **下一篇：[开发一个基于React Native的简易demo–导航栏+轮播图][React Native_demo]** ####

[http_bbs.reactnative.cn_api_category_3]: http://bbs.reactnative.cn/api/category/3
[http_clips.vorwaerts-gmbh.de_big_buck_bunny.mp4]: http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4
[SouthEast]: /images/20220604/3fb6b7ca88f94149aa90b499f17649a2.png
[SouthEast 1]: /images/20220604/f739a5f0c6e44ec9b766a190e1dab591.png
[SouthEast 2]: /images/20220604/fc3a05ec9fce4d78bf1d14134f0fe60a.png
[SouthEast 3]: /images/20220604/548b345887b64ec79368f231e390562e.png
[React Native_demo]: http://blog.csdn.net/change_on/article/details/78737777

发表评论取消回复

表情：

评论列表（有 0 条评论，399人围观）

还没有评论，来说两句吧...

相关阅读

相关 react-native注意事项，开发前必读文档

react-native各种不同点总结 1. 平台区别 2. 样式处理及不同点 3. 特殊注意点 ![在这里插入图片描述]

傷城~/ 2022年10月11日 15:59/ 0 赞/ 28 阅读

相关 React Native官方DEMO

官方给我们提供了UIExplorer项目，这里边包含React Native的基本所有组件的使用介绍和方法。运行官方DEMO步骤如下安装react native环

深碍√TFBOYSˉ_/ 2022年09月22日 03:38/ 0 赞/ 183 阅读

相关开发一个基于React Native的简易demo--源码

这几篇博客的最终目地是为了给我自己做笔记，所以我不管文章对其他人有没有帮助。只为我自己！！！源码： / Sample React Native App h

r囧r小猫/ 2022年06月04日 07:10/ 0 赞/ 195 阅读

相关开发一个基于React Native的简易demo--读取网络数据并展示

react-native的网络请求用fetch，及其简单，请求到的数据保存起来，react-native用state来保存数据，类似于Java的request，还可以传递给另一

我不是女神ヾ/ 2022年06月04日 07:10/ 0 赞/ 172 阅读

相关开发一个基于React Native的简易demo--视频组件+布局

一、视频组件这里用：react-native-video，详见官网：[https://github.com/react-native-community/react-

梦里梦外;/ 2022年06月04日 07:06/ 0 赞/ 212 阅读

相关开发一个基于React Native的简易demo--导航栏+轮播图

文件位置：App.js 一、导航栏引进react-navigation组件，详细用法见官网：[https://reactnavigation.org][https_

迈不过友情╰/ 2022年06月04日 06:58/ 0 赞/ 207 阅读

相关开发一个基于React Native的简易demo--前记

这阵子在学习react native，说实话，坑真多！！！学习的过程也是不断的踩坑，艰难前进，这几天也断断续续的做了一个非常简单的demo. 用到的技术：

不念不忘少年蓝@/ 2022年06月04日 06:57/ 0 赞/ 400 阅读

相关 React Native 开发总结

前言 2015年3月, Facebook正式发布react-native，只支持iOS平台；2015年9月，Facebook发布了React Native for Andro

Love The Way You Lie/ 2022年02月13日 13:27/ 0 赞/ 197 阅读

相关 react-native开发

react-native 开发 1.React-native的运行机制 RN 这套框架让 JS开发者可以大部分使用JS代码就可以构建一个跨平台APP。 Facebo

喜欢ヅ旅行/ 2022年01月05日 08:49/ 0 赞/ 397 阅读

相关 react-native mobx实现购物车demo

import React,{Component} from 'react'; import { View, Text, Image, FlatList,Text

电玩女神/ 2021年09月08日 15:08/ 0 赞/ 419 阅读