![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
reactnative
写代码的小珊子
这个作者很懒,什么都没留下…
展开
-
React Native选择器Picker
如果要从多个已知的选项中选择一个,那么可以使用React Native内置的选择器选择器类似于HTML中的select标签import React, { Component } from 'react';import { View, Text, Picker, StyleSheet } from 'react-native'class App extends Component { users = [ {label: '请选择性别',value:''}, {la.原创 2020-05-08 20:09:40 · 1465 阅读 · 0 评论 -
React Native状态栏组件StatusBar
状态栏StatusBar就是手机屏幕最顶上的一个区域,包含运营商名称,网络情况,电池情况那一条暗色系import React, { Component } from 'react';import {View, Text, StatusBar, StyleSheet, TouchableOpacity} from 'react-native'class App extends Component { state = { hidden:false, //状态栏样式原创 2020-05-08 19:33:34 · 423 阅读 · 0 评论 -
React Native动画组件Animated-----案例
import React, { Component } from 'react'import { View, StyleSheet, Animated, TouchableOpacity } from 'react-native'class App extends Component { //为什么要使用UNSAFE_componentWillMount,因为componentWil...原创 2020-05-07 21:29:03 · 234 阅读 · 0 评论 -
Reactnative存储数据组件AsyncStorage
AsyncStorage是一个简单的,未加密的,异步的,持久的键值存储系统AsyncStorage是一个全局的存储系统,没有实例这一概念,要存储数据就要往里面扔,要读取数据就发起请求AsyncStorage对外提供了简单的JavaScript接口,每一个接口都是异步的,每一个接口都返回一个Promise对象Reactnative存储数据组件AsyncStorage需要安装组件npm i ...原创 2020-05-07 20:32:41 · 410 阅读 · 0 评论 -
Reactnative弹出框Alter
弹出框是浮与界面之上的,用于阻止用户的下一步操作,知道用户点击了弹出框上的任意按钮为止弹出框一般用于弹出提示,弹出警告,弹出确认等需要用户注意和确认的动作import React from 'react'import { Alert, Text, TouchableOpacity, StyleSheet, View } from 'react-native'const App = (...原创 2020-05-07 19:53:20 · 540 阅读 · 0 评论 -
Reactnative活动指示器组件ActivityIndicator
Reactnative活动指示器组件ActivityIndicator有一些比较耗时的操作,可能需要用户等待,那么就可以用活动指示器组件ActivityIndicator告诉用户你需要等待其实,任何从用户点击开始,不能立刻给予用户反馈的操作,都需要使用活动指示器组件ActivityIndicator告诉用户等待片刻引入组件import {ActivityIndicator} from ...原创 2020-05-07 19:43:01 · 335 阅读 · 0 评论 -
Reactnative图片组件Image
Reactnative图片组件ImageReactnative内建了图片组件image来显示图片,这个组件既可以显示本地图片,也可以显示网络图片,还可以显示base64格式的图片引入组件使用Image组件首先要引入此组件import {Image} from 'react-native案例import React,{Component} from 'react';import {Vi...原创 2020-05-07 19:20:55 · 525 阅读 · 0 评论 -
ReactNative输入组件TextInput的使用方法
输入组件TextInput就是让用户输入数据的,比如输入登录有用户名,输入登录密码,除了简单的单行输入框外,还可以用于输入大量的文本,比如输入用户反馈,输入用户说明等React Native–输入组件TextInputTextInput组件是React Native的内置组件,不需要做额外的安装引入组件需使用输入组件Textinput,必须先引入import {TextInput} fr...原创 2020-05-07 18:14:20 · 2341 阅读 · 0 评论 -
Reactnative中的组件状态state----案例
点击name使下面的特点标签改变import React,{Component} from 'react';import {View,Text,Image,StyleSheet} from 'react-native';export default class App extends React.Component{ state={ name:'老曹', type:'好...原创 2020-05-07 16:59:34 · 212 阅读 · 0 评论 -
Reactnative字体的样式
import React,{Component} from 'react';import {View,Text,Image,StyleSheet} from 'react-native';const App=()=>{ return( <View style={styles.container}> <Text style={styles.tex...原创 2020-05-07 14:06:11 · 833 阅读 · 0 评论 -
reactnative中的弹性布局
import React,{Component} from 'react';import {View} from 'react-native';export default class FlexDirectionBasics extends Component{ render(){ return( //设置三个元素,水平排列,水平平均分布,竖直居中 <...原创 2020-05-07 13:48:51 · 182 阅读 · 0 评论