腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

移动开发面面观

专栏作者

80

文章

94692

阅读量

30

订阅数

React Native的state

前言在React的世界里，界面是由一个个Component拼出来的。当我们需要渲染一个界面时，以<View>为父控件。<Text>或自定义的<CustomText>为子控件。我们通过重写Compenent的render方法，来实现控件的渲染。那么，Compenent的render方法何时调用呢？ AppRegistry.registerComponent调用时，会调用render方法。就是state变化时，会调用render方法。因此，当我们数据改变，需要重新调用render时，我们应该将数据存入s

2018-07-03

8130

React Native的列表显示

前言在一个移动App中，我们最常用的内容展现形式就是列表。今天，我们尝试用React Native完成对列表的开发。 ListView ListView作为一个React Native官方提供的控件，我们需要了解它的属性。 dataSource 是列表的数据源，通常以一个数组的形式传给ListView。 renderRow 是列表的表现层，我们可以获得dataSource的单项数据，然后用于单项渲染。官方例子 import React, { Component } from 'react'; impor

2018-07-03

1.8K0

React Native的数据持久化

前言在数据驱动的开发中，数据的缓存是非常重要的一环。我们从网络或其他地方获取了数据，如果每次用完就抛弃势必会浪费CPU的性能和用户的流量。因此，我们需要对数据进行持久化处理。介绍 React Native中提供了AsyncStorage类用于持久化的处理数据。相关资料reactnative.cn 由于AsyncStorage接口比较复杂，社区中出现了不少基于AsyncStorage的封装库，我们今天就使用了其中一款——react-native-storage code import Storage

2018-07-03

2K0

React Native的动画（一）

前言 React Native作为大前端开发的一种技术，自然离不开各种炫酷的动效。在React Native中动效有两种实现的方式。它们分别为：** LayoutAnimation、 Animated**。今天，我们给一个LayoutAnimation的例子。LayoutAnimation适合开发相对简单的动画。如，一个界面的出现，或一个按钮做一些简单的缩放动画。一个例子需求创建一个<Text>，每次点击它时，它就会以动画的形式变大（长宽各增加50像素）。动画持续时间5s。具有一定的弹性。 code

2018-07-03

1.2K0

React Native的HTTP请求

前言在一般的手机App中，HTTP请求是一种最常见的获取数据的方式。我们的App要连上广阔的互联网，才能带来一个丰富的世界。那么，在React Native中如何发起HTTP请求呢？发起网络请求要从任意地址获取内容的话，只需简单地将网址作为参数传递给fetch方法即可（fetch这个词本身也就是获取的意思）： fetch('https://mywebsite.com/mydata.json') Fetch还有可选的第二个参数，可以用来定制HTTP请求一些参数。你可以指定header参数，或是指定使用P

2018-07-03

1.8K0

React Native的动画（二）

前言上一节中，介绍了React Native的LayoutAnimation。LayoutAnimation可以用来开发简单的动画。但面对组合动画的开发，就不那么方便了。因此，在React Native中还有一个Animated来完成复杂动画的开发。 Animated Animated类似于一个单纯的值动画类。它本身并不完成任何动画的功能实现。我们通常将它设进state中。然后在合适的时机，调用Animated.timing().start()来开始执行动画。动画本身，以参数的形式传入timing方法中。

2018-07-03

1K0

React Native的props

前言在React的世界里，界面是由一个个Component拼出来的。当我们需要渲染一个界面时，以<View>为父控件。<Text>或自定义的<CustomText>为子控件。在渲染时，我们一定希望对子控件传递一些参数。props就可以让我们在控件中，获取来自父控件的参数。一个例子现在我们尝试实现一个让字符串反转的<Text>。 import React, { Component } from 'react'; import { Text, } from 'react-native'; class

2018-07-03

9380

React Native 一个开始

React Native是Facebook开源的一个移动端开发框架。Facebook用js封装了大量的原生控件，让开发可以用React.js开发移动端App。我们可以在React中文网查看开发环境的搭建。 http://reactnative.cn/docs/0.44/getting-started.html#content 搭建完环境后，我们可以看到一个极简的demo: import React, { Component } from 'react'; import { AppRegistry,

2018-07-03

3640

没有更多了

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态