React-Native 学习第三天:State 制作闪烁文字

简介: 一、简介我们使用两种数据来控制一个组件:props和state。props是在父组件中指定,而且一经指定,在被指定的组件的生命周期中则不再改变。 对于需要改变的数据,我们需要使用state。

一、简介
我们使用两种数据来控制一个组件:props和state。props是在父组件中指定,而且一经指定,在被指定的组件的生命周期中则不再改变。 对于需要改变的数据,我们需要使用state。

二、例子:闪烁文字

假如我们需要制作一段不停闪烁的文字。文字内容本身在组件创建时就已经指定好了,所以文字内容应该是一个prop。而文字的显示或隐藏的状态(快速的显隐切换就产生了闪烁的效果)则是随着时间变化的,因此这一状态应该写到state中。

新建一个文件夹用于存放本节的demo,使用如下命令创建新的项目。

react-native init TestRN_State --version 0.44.3
cd TestRN_State
react-native run-ios

运行起来新建的demo,就是RN默认的欢迎页面。
我们进入新建的项目的文件夹,找到

img_e95fe4fdcc3a518037aadf760c9bf5c3.png
image.png

文件,打开。

找到 export default class TestRN_State extends Component
把里面的内容删掉,我们要写入自己的内容。
我们先写控制文字闪烁状态的代码,闪烁状态作为一个组件存在,我们取名为Blink。

img_5b09205e5d9b9aa2f1c9be203a3fc52a.png
image.png

然后是文本部分,写在默认的组件中。

img_9ce9be5a00bf5a073e302b9beb89bc60.png
image.png

然后刷新模拟器,就可以看到闪烁的文字了。

目录
相关文章
|
4月前
|
前端开发 API UED
怎么学习React 18 进行项目开发?
【4月更文挑战第18天】学习React 18涉及新特性如并发模式、Suspense API和自动批处理更新,可提升性能和用户体验。首先了解这些新特性,然后掌握React基础知识,如组件化、JSX、props和state。使用Create React App创建项目,学习如何启用并发模式和使用Suspense显示占位符。实现自定义组件,关注props传递、状态管理和事件处理。通过Profiler优化性能,利用懒加载和代码分割减少加载时间,使用Context API共享状态。不断实践和探索,参考官方文档与社区资源,以提高开发技能。
143 3
|
4月前
|
前端开发 JavaScript API
如何学习react
【4月更文挑战第9天】 学习React前,需掌握JavaScript基础,了解React的JSX、组件、props、state和生命周期等概念。安装Node.js和npm,用Create React App搭建环境。学习核心API,如React.createElement、React.render等,并阅读官方文档。实践项目,从Todo List开始,逐渐挑战复杂应用。同时,学习相关技术如Redux、React Router,并参与社区交流,持续关注React新发展。持之以恒,祝学习顺利!
46 10
|
4月前
|
前端开发 JavaScript
react学习(Effect)
react学习(Effect)
49 3
|
11天前
|
JSON 前端开发 JavaScript
|
20天前
|
前端开发
React组件实例更改state状态值(四)
【8月更文挑战第14天】React组件实例更改state状态值(四)
24 1
React组件实例更改state状态值(四)
|
20天前
|
前端开发 JavaScript
React组件实例state(三)
【8月更文挑战第14天】React组件实例state(三)
24 1
React组件实例state(三)
|
13天前
|
前端开发 JavaScript 数据处理
如何学习React的高级概念?
【8月更文挑战第26天】如何学习React的高级概念?
24 2
|
13天前
|
前端开发 JavaScript API
学习 React 的方法
【8月更文挑战第26天】学习 React 的方法
26 1
|
30天前
|
前端开发 JavaScript 算法
如何学习react原理
【8月更文挑战第9天】 如何学习react原理
34 6
|
8天前
|
存储 前端开发
React 中的 state 和 props 有什么区别?
【8月更文挑战第31天】
14 0

热门文章

最新文章

下一篇
DDNS