![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React-Native
fanxiao_168
这个作者很懒,什么都没留下…
展开
-
var let const 三则如何区分?
想弄清楚这三者的区别,我们需要知道这三者最基本的来龙去脉。var是ES5中的变量,let、const是ES6中的变量。块级作用域是在ES6中引进的,那么什么是块级作用域呢?简单的来说,就是包含在{…}中的代码就是叫块级作用域,其中for语句、if语句也属于块级作用域。既然是在ES6中才有的块级作用域,而且let、const也是ES6中有的,由此可见,这两者肯定跟块级作用域有瓜葛,有说不清道...原创 2019-08-08 09:38:35 · 219 阅读 · 0 评论 -
react-native环境安装
环境安装说明凡是安装开发环境,都需要注意以下几点,防止意外错误的发生:安装的软件目录中不要出现中文与特殊字符,尤其是空格计算机名称(控制面板\所有控制面板项\系统中设置)不要中文,改成英文,也不要特殊字符Node环境如果已经安装过Node并且是使用安装包单独安装,那么先卸载掉,然后使用nvm进行安装,好处是可以动态切换Node版本以适应不同环境的需求,目前ReactNative需要...原创 2019-08-21 11:39:45 · 158 阅读 · 0 评论 -
移动APP介绍
移动指的是移动设备平台, app 是应用 (application) 的缩写, 移动App就是移动设备上运行的应用程序种类划分WebAPP:网页应用, 需要运行在浏览器环境中, 无需安装即可使用使用纯web技术开发实现由浏览器负责UI界面的渲染NativeAPP:原生应用, 直接运行在移动设备上, 需要安装后使用主要采用设备原生语言开发实现, 利用一些新技术可使用其他语言...原创 2019-08-21 11:38:07 · 1371 阅读 · 1 评论 -
豆瓣电影案例
项目创建与目录结构设计使用create-react-native-app projectName命令创建一个项目,然后在项目中创建src文件夹作为源代码目录,里面创建config目录存放常量与配置数据,创建components目录存放项目组件,组件划分为公共组件与页面组件两种。- src - config - api.js: 项目所需接口 - component...原创 2019-08-20 15:54:42 · 676 阅读 · 0 评论 -
React Native Enviroment
React Native Enviroment前面我们使用的开发方式是进化过的方式,简述步骤就是,先安装一个Expo应用程序,然后使用扫一扫功能在Expo内运行我们的App,偏向传统的前端开发方式。这在之前,React Native采用的开发方式是先把写好的项目打包编译成一个独立App,然后直接安装到手机上运行,偏向传统的Native开发方式。环境预览[参照文档] http://reac...原创 2019-08-20 15:49:38 · 305 阅读 · 0 评论 -
ScrollView组件的基本使用
下面代码是在ES6语法,实现图片的播放,但拖到时停止(onScrollBeginDrag)和停止拖动(onScrollEndDrag)后继续播放会出现问题,做个记录,也请大神指点一下。import React, {Fragment,Component} from 'react';import { SafeAreaView, StyleSheet, ScrollView, Vi...原创 2019-08-14 19:46:12 · 557 阅读 · 0 评论 -
FlatList实践
下面这个问题暂时还没有解决import React, {Fragment,Component} from 'react';import { SafeAreaView, StyleSheet, ScrollView, View, Text, Image, FlatList, TouchableOpacity, Alert} from 'react-nat...原创 2019-08-19 16:07:49 · 130 阅读 · 0 评论 -
react-native 加载图片的几种方式
一、RN本地项目图片访问1.1、通过source——require访问<Image source={require(’./img/icon.png’)} style={styles.imageStyle}/>1.1.1、 Image的缩放模式resizeModecover: 保持图片宽高比缩放直到图片宽和高都等于或者大于容器宽高,默认属性contain: 保持图片宽高比缩...原创 2019-08-07 16:16:20 · 5175 阅读 · 0 评论 -
屏幕适配之获取屏幕的分辨率
import React, {Fragment} from 'react';import { SafeAreaView, StyleSheet, ScrollView, View, Text, StatusBar,} from 'react-native';import { Header, LearnMoreLinks, Colors, Debug...原创 2019-08-07 11:30:40 · 312 阅读 · 0 评论 -
FlexBox布局
import React, {Fragment} from 'react';import { SafeAreaView, StyleSheet, ScrollView, View, Text, StatusBar,} from 'react-native';import { Header, LearnMoreLinks, Colors, Debug...原创 2019-08-07 10:32:50 · 110 阅读 · 0 评论 -
React-Native 生命周期(ES6)
在React Native中使用组件来封装界面模块时,整个界面就是一个大的组件,开发过程就是不断优化和拆分界面组件、构造整个组件树的过程。所以学习理解组件的生命周期显得尤为重要!一、组件的属性(props)和状态(state)属性(props)它是组件的不可变属性(组件自己不可以自己修改props)。组件自身定义了一组props作为对外提供的接口,展示一个组件时只需要指定props作为...原创 2019-08-09 10:15:42 · 862 阅读 · 0 评论 -
QQ登录界面案例布局
import React, {Component} from 'react';import { SafeAreaView, StyleSheet, ScrollView, View, Text, Image, TextInput, TouchableOpacity, Alert} from 'react-native';...原创 2019-08-08 20:05:23 · 830 阅读 · 0 评论 -
组件Image和九宫格效果
/** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow */import React, {Fragment , Component} from 'react';import { SafeAreaView, StyleSheet, Scro...原创 2019-08-08 11:24:10 · 364 阅读 · 0 评论 -
React Native环境搭建
brew update && brew doctor原创 2019-08-01 19:28:55 · 259 阅读 · 0 评论 -
ReactNative 快速开始
ReactNative 快速开始学习使用 ReactNative 最令人头疼的就是环境问题,因为大多数 Web 开发者,并不熟悉 Android 与 IOS 的开发环境,配置起来比较繁琐。当然 Android 程序员也不熟悉 IOS 环境,反之亦然,这导致很多人因为繁杂的开发环境而放弃学习或者暂时搁浅。为了改善这个问题,一个快速的开发环境解决方案应运而生。这个方案需要两个工具:1. creat...原创 2019-08-21 11:51:58 · 1005 阅读 · 0 评论