![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
自己学习react的简单心得与历程
阳光下的冷静
本人很菜,分享自己平时学习前端的小知识点,希望对大家有用。
展开
-
React简介
React简介如果你进入官方网站,只会看到一句简单的介绍:A JavaScript library for building user interfaces (用于构建用户界面的JavaScript库)虽然是很简单的一句话,显得朴实无华,但是却包含最伟大的道理,让人感觉的到它的强大React三大体系如下图:对于React的三大体系的学习也是有一个层次的,需要你先学会React.j...原创 2019-11-19 20:02:38 · 1241 阅读 · 1 评论 -
签名打包发布Release版本的apk安装包
签名打包发布Release版本的apk安装包请参考以下两篇文章:ReactNative之Android打包APK方法(趟坑过程)React Native发布APP之签名打包APK如何发布一个apk先保证自己正确配置了所有的 RN 环境在 cmd 命令行中,运行这一句话keytool -genkey -v -keystore my-release-key2.keystore -...原创 2019-11-16 14:51:31 · 8808 阅读 · 0 评论 -
react调用摄像头拍照
React调用摄像头拍照场景在一些移动app的个人登陆页面往往有头像的地方,我们可以根据自己的喜好随意的更换我们的头像。那么在react-native的项目中如果轻松的实现这一功能,下面有一些简单的步骤。React调用摄像头拍照功能实现步骤在项目的终端中运行npm install react-native-image-picker@latest --save命令安装到项目运行依赖,此时调试...原创 2019-11-16 14:47:43 · 4872 阅读 · 3 评论 -
React轮播图使用
React轮播图使用使用react-native开发的移动端的项目往往有轮播图的存在,尤其是首页,如果正确使用轮播图,下面有一些简单的步骤。在项目的终端运行npm i react-native-swiper --save命令安装轮播图组件在要使用轮播图的页面中导入轮播图组件import Swiper from 'react-native-swiper';其中,在Swiper身上,show...原创 2019-11-16 14:35:40 · 1158 阅读 · 0 评论 -
React-Native的路由使用
React使用场景在一些首页或者其他的页面中,往往存在一些链接(标题),就像是手机里的淘宝一样,每一种商品都存在商品详情,我们点击江宁区就会切换到另一个页面,这里的应用就是路由实现的,下面就React中的路由的使用做简单的说明React路由使用步骤安装路由:在项目的终端运行命令 npm i react-native-router-flux --save导入路由相关的组件(在需要使用路由链...原创 2019-11-16 14:24:31 · 1164 阅读 · 0 评论 -
React组件生命周期
React组件的生命周期概念:在组件创建、到加载到页面上运行、以及组件被销毁的过程中,总是伴随着各种各样的事件,这些在组件特定时期,触发的事件,统称为 组件的生命周期;组件生命周期分为三部分: 组件创建阶段:组件创建阶段的生命周期函数,有一个显著的特点:创建阶段的生命周期函数,在组件的一辈子中,只执行一次;componentWillMount: 组件将要被挂载,此时还没有开始渲染虚拟...原创 2019-10-17 15:07:14 · 348 阅读 · 0 评论 -
React创建组件
React创建组件React创建组件有两种方式:构造函数和class关键字构造函数:第一种基本组件的创建方式(构造函数),就是一个最基本的组件,想要把组件放在页面中,可以把 构造函数的名称,当作 组件的名称,以HTML标签形式引入页面中即可注意:React在解析所有的标签的时候,是以标签的首字母来区分的,如果标签的首字母是小写的,那么就按照 普通的 HTML 标签来解析,如果首字母是...原创 2019-10-16 12:29:08 · 225 阅读 · 0 评论 -
JSX语法
JSX语法注意点如要要使用 JSX(符合XML规范的JS语法) 语法,必须先运行 cnpm i babel-preset-react -D,然后再 .babelrc 中添加 语法配置(在presets中加入一个"react");JSX语法的本质:JSX内部在运行的时候,也是先把 类似与HTML这样的标签代码转换为 React.createElement的形式来实现的,并没有直接把 用户写的 ...原创 2019-10-15 21:50:52 · 707 阅读 · 1 评论 -
React项目的创建
React项目的创建运行 cnpm i react react-dom -S 安装包在项目中导入两个相关的包:// 1. 在 React 学习中,需要安装 两个包 react react-dom// 1.1 react 这个包,是专门用来创建React组件、组件生命周期等这些东西的;// 1.2 react-dom 里面主要封装了和 DOM 操作相关的包,比如,要把 组件渲染到页面...原创 2019-10-15 21:44:55 · 208 阅读 · 0 评论 -
React中的核心概念
React中几个核心的概念虚拟DOM(Virtual Document Object Model)DOM的本质是什么:就是用JS表示的UI元素DOM和虚拟DOM的区别:DOM是由浏览器中的JS提供功能,所以我们只能人为的使用 浏览器提供的固定的API来操作DOM对象;虚拟DOM并不是由浏览器提供的,而是我们程序员手动模拟实现的,类似于浏览器中的DOM,但是有着本质的区别虚拟DOM:优...原创 2019-10-15 21:39:24 · 355 阅读 · 0 评论