ReactNative学习笔记之一

最新推荐文章于 2024-04-29 00:06:35 发布

丑小鸭是白天鹅

最新推荐文章于 2024-04-29 00:06:35 发布

阅读量151

点赞数

分类专栏： RN

本文链接：https://blog.csdn.net/u013519084/article/details/81327389

版权

RN 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

基本组件:

View：创建UI最基本的嘴贱 ScrollView: 滑动容器

Text: 展示文字 StyleSheet: 样式

Image: 展示图片

TextInput: 编辑框

交互组件:

Button: 按钮 Picker: 选择器 Slider: 单选 Switch: true和false的选择

ListView列表展示组件:

FlatList: 连续数据列表 SectionList:分组列表

针对andorid组件和apis(此处省略ios的):

BackHandler: 接收andorid返回外部按钮点击 DatePickerAndroid: 打开标准的android日期选择弹窗

DrawerLayoutAndroid: 渲染抽屉展示效果 PermissionAndroid: 检查用户权限授权针对6.0以上手机

ProgressBarAndroid: 渲染一个进度条 TimePickerAndroid: 打开标准的android时间选择弹窗

ToastAndroid: 显示andorid toast提示 ViewPagerAndrdoi: 创建viewpager

TollbarAndorid: 显示TollBar

其它组件:

ActivityIndicator: 显示一个圆形的加载指示器 Alert: 启动一个带标题和消息内容的对话框

Animated: 动画库 CameraRoll: 进入本地相册和图库 Clipboard: 给剪切板设置或从剪切板获取内容

Dimensions: 获取设备尺寸 KeyboardAvoidingView: 避开虚拟键盘的view Linking: 链接

Modal: 在其它布局之上显示的悬浮控件 PixelRatio: 获取设备像素尺寸 RefreshControl: 用在scrollview内下拉刷新

StatusBar: 控制app状态栏的组件 WebView:: 渲染网页内容

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

丑小鸭是白天鹅

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

React Native入门篇—BackHandler安卓返回键判断返回页面或关闭APP

长腿欧巴的博客

01-16

4877

注意：未经允许不可私自转载，违者必究 React Native官方文档：https://reactnative.cn/docs/backhandler/ 项目地址GitHub地址：https://github.com/zhouwei1994/nativeCase.git 安卓返回键配置本项目是用react-navigation来做路由，路由长度需要由redux来托管，所以下面代码会...

React Native之hardwareBackPress

码莎拉蒂

10-25

4148

1 hardwareBackPress 我们用hardwareBackPress来监听手机物理返回键 2 js那边常用写法 BackHandler.addEventListener('hardwareBackPress', this._back); 3 我们看下Android源代码分析是怎么触发到这里来的 1) ReactActivity....

参与评论您还未登录，请先登录后发表或查看评论

React Native技术篇—自定义popup弹窗

长腿欧巴的博客

01-16

3391

注意：未经允许不可私自转载，违者必究 React Native官方文档：https://reactnative.cn/docs/getting-started/ 项目GitHub地址：https://github.com/zhouwei1994/nativeCase.git 在写自定义Toast弹窗之前我们要先创建一个React Native第二视图层。创建教程：https:...

React Native学习笔记之一

白汐月的IT专栏

07-05

1858

概述：React Native 是现在比较火的Android APP开发技术，由FaceBook推出的基于JSX开发的一个可以跨平台开发的框架。 Facebook在这个框架中提出了一个理念： Learn once, write anywhere 也是这个框架的优势所在。目前基于RN开发的APP有：天猫iPad客户端，支付宝，携程网,Facebook Group，Chinese Flashcard

React Native学习笔记（一）入门基础

Fighting_初心的博客

05-29

666

作为目前流行的跨平台技术框架之一，React Native是Facebook技术团队于2015年4月在早先的React前端框架基础上开源的一套移动跨平台开发框架，可以同时支持iOS和Android两大移动平台。

React Native 学习笔记

Donkey的博客

09-11

453

1.React Native 中如何实现根据state控制组件的显示与隐藏 render() { return( { this.state.abc == null ? ( null ) : ( <View> ...

React Native学习笔记

toyong的博客

12-23

181

React Native学习笔记React Native简介React Native工程启动流程1.工程目录结构2.工程启动流程分析3.App.js文件运行步骤常用的React Native组件View组件Text组件Image组件Button组件TouchableOpacity组件 React Native简介 React Native是Facebook发布的一个跨平台解决方案，它成为原生手机端App必不可少的开发模式之一。目前比较成熟的跨平台方案有 1）React Native 2）AppCan 3）F

react native 学习笔记之state

wxq888的专栏

08-30

876

state状态还是可以理解为Android，ios中一个类的成员变量，而props和state的区别是，props一经指定，就不能修改，而state是可以修改的。一般来讲，你需要在constructor中初始化state，然后在需要修改时调用setState方法。

native react 折线图_ReactNative学习笔记六之折线图

weixin_32569115的博客

01-12

614

由于项目需要，最近调研使用EChart，百度的这个项目真的是很不错，使用方便，接口清晰。今天就跟大家分享一下。使用方式EChart需要native-echarts库，所以一上来需要npm install native-echarts --save然后就可以在你的项目中使用了。废话不多说，我先上代码：import React, {Component} from 'react';import {App...

React Native之React速学教程_不学react直接学react native可以吗

最新发布

2401_84447149的博客

04-29

577

每一个XML标签都会被JSX转换工具转换成纯JavaScript代码，使用JSX，组件的结构和组件之间的关系看上去更加清晰。JSX并不是React必须使用的，但React官方建议我们使用 JSX , 因为它能定义简洁且我们熟知的包含属性的树状结构语法。

React Native学习笔记(2)--新闻列表实现

dapan的专栏

05-31

1846

本篇是在学习《React Native入门与实战》这本书时做的笔记，代码基于React Native 0.44实现的，算是对该书中代码的小小更新。Text组件是一个用来展示文本的组件。我们可以给它设置按下动作(onPress)，设置它的行数(numberOfLines)。书中的新闻列表包括三部分，头部、列表项和要闻。

React Native v0.55 学习笔记1

mmrx的博客

06-02

865

React Native v0.55 学习笔记1 学习内容来自官网文档0.55版本 RN 是基于 React 的思想，相比于 web 的一些组件，RN 使用的是基于原生（ android、ios ）的组件。所以想用 RN 开发应用的话，就需要了解一些 React 方面的概念。例如 JSX，component，state 和 props。 Hello World RN 使用的是 J...

React Native学习资源汇总

xiangzhihong8的专栏

08-01

2319

目前主流的移动跨平台技术方案大体可以分为三类，一类是使用原生内置浏览器加载HTML5的Hybrid技术方案，采用此种方案的主要有Cordova、Ionic和微信小程序；另一类是使用JavaScript语言进行开发，然后使用原生组件进行渲染，采用此方案的主要有React Native、Weex和快应用；最后一类是使用自带的渲染引擎和自带的原生组件来实现跨平台，采用此种方案的主要是Flutter。对于其他的浏览器方案，基本可以抛弃了，现在我们讨论移动跨平台开发主要说的是React Native和Flutter

ReactNative 原生混合开发打包ipa和apk

2401_84092903的博客

04-20

976

由于篇幅限制，pdf文档的详解资料太全面，细节内容实在太多啦，所以只把部分知识点截图出来粗略的介绍，每个小节点里面都有更细化的内容！点击【学习资料】即可免费领取！节点里面都有更细化的内容！点击【学习资料】即可免费领取！[外链图片转存中…(img-Mjpdpzcq-1713552806304)][外链图片转存中…(img-Wo8tEerH-1713552806304)]

Rn项目中tsc命令编译文件报错Cannot redeclare block-scoped variable变量重复定义问题

罗春娥的技术园

08-08

8392

产生这个问题的原因是: 在默认状态下，typescript 将 DOM typings 作为全局的运行环境，所以当我们声明 name时，与 DOM 中的全局 window 对象下的 name 属性出现了重名解决方式: 在tsconfig.json文件中添加libs es2015定义: "compilerOptions": { "module": "es2015", "...

使用visual studio code和typescript开发混合App，windows环境搭建

罗春娥的技术园

07-31

2538

这里附一篇写得很好的rn项目初始化基本运行的博客，里面有常出现的运行问题:: https://blog.csdn.net/ApacheEdward/article/details/81209104 第一步: 安装vscode即visual studio code,安装包下载地址: https://code.visualstudio.com/download 安装过程都是很傻瓜似的，就不用...

Rn报bug: Unable to resolve module AccessibilityInfo from XXX和Module build failed: Error: Plugin 0 spe

罗春娥的技术园

08-04

1306

最近在搞RN，但是一直红屏，主要报了两个bug： Unable to resolve module AccessibilityInfo from XXX 和 Module build failed: Error: Plugin 0 specified in “base” … provided an invalid property of “default” 经过一个csdn博客的引导解决问题...

入门react-native——state和ref使用

罗春娥的技术园

10-22

1132

一、state定义两种方式; 1.1、组件内直接定义: state={ size:80, } 1.2、构造方法内定义: constructor(props){ super(props); this.state={ size:80, } } 二、React Native的ref使用详解（...

React-Native学习笔记：组件与JSX语法解析

这个文档是作者在学习React-Native过程中整理的个人笔记，主要涵盖了React的基础语法和React-Native的一些核心概念。 #### React基础知识 React是一种用于构建用户界面的JavaScript库，它的核心理念是组件化。以下...