React基础知识学习

一口八宝周

已于 2022-04-23 16:31:35 修改

阅读量704

点赞数

分类专栏： react 文章标签： react

于 2022-04-23 16:15:09 首次发布

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/Aguai229/article/details/124364492

版权

react 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

目录

state的使用——变量的渲染和修改

props属性传递

state的使用——变量的渲染和修改

在组件里通过{}在jsx中进行渲染变量

如果数据需要修改并响应出来，则需要将变量放在state里面，同时使用setState修改变量

setState是异步的，同一个生命周期会批量操作更新state

首先初始化变量

state={
    count: 0
}

直接使用state声明变量和在constructor中使用this.state的方式是一样的

然后就是修改变量需要在setState中，下面是写在了一个周期函数中的，并且使用了回调函数打印了count的值，可以看到该方法确实是异步的，但是为什么异步？原谅我不知道，等我学会了再慢慢知其然知其所以然吧

运行效果如下

所以，有没有大神给我说说为什么setState是异步的呢？为什么

props属性传递

父组件向子组件传递的时候通过props接收

方式有3种，分别是class组件使用、function组件使用、解构赋值

首先在父组件中import子组件

import PropsDemo from './PropsDemo'

然后在父组件中写入传递参数

然后子组件通过props.title即可获得参数，下面是三种写法

啊妈妈我学会了！！！

一口八宝周

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
React基础知识学习

在组件里通过{}在jsx中进行渲染变量如果数据需要修改并响应出来，则需要将变量放在state里面，同时使用setState修改变量setState是异步的，同一个生命周期会批量操作更新state首先初始化变量state={ count: 0}直接使用state声明变量和在constructor中使用this.state的方式是一样的然后就是修改变量需要在setState中，下面是写在了一个周期函数中的，并且使用了回调函数打印了count的值，可以看到该方法确实是异步的
复制链接

扫一扫

专栏目录

一口八宝周 CSDN认证博客专家 CSDN认证企业博客

码龄5年

52: 原创

9万+: 周排名

22万+: 总排名

9万+: 访问

: 等级

653: 积分

15: 粉丝

61: 获赞

38: 评论

174: 收藏

私信

关注

热门文章

分类专栏

异常积累
idea 2篇
vue 2篇
css&html 1篇
umi 4篇
react 9篇
npm 4篇
并发编程 6篇
工具类 2篇
SpringBoot 6篇
java8 6篇
Mysql 2篇
poi 1篇
ElasticSearch 3篇
Redis 3篇
小程序 1篇

最新评论

一天实现用poi-tl导出word（饼图/柱状图、文字、表格、循环word），男朋友看完直呼好家伙
代码缝合: 更改表格中的数据，图表会变化吗
IDEA高效调试，你真的会了吗
哈哥撩编程: 感谢博主分享的优质文章，帮助编程初学者少走弯路～
一天实现用poi-tl导出word（饼图/柱状图、文字、表格、循环word），男朋友看完直呼好家伙
一口八宝周: 引下依赖，应该就可以跑通了，问题不大，之前太早了没写那么详细
一天实现用poi-tl导出word（饼图/柱状图、文字、表格、循环word），男朋友看完直呼好家伙
Collapseball: 就只贴个方法，Report的定义，包的引入贴出来也好跑一些啊
SpringBoot项目防止Sql注入
WorldWelcome: 1）不知道为啥，filterConfig.getInitParameter("regex") 不起作用 2）正则也不对，直接用这个吧 paraValue.contains("net user") || paraValue.contains("xp_cmdshell") || paraValue.contains("add") || paraValue.contains("exec master.dbo.xp_cmdshell") || paraValue.contains("net localgroup administrators") || paraValue.contains("select") || paraValue.contains("average") || paraValue.contains("count") || paraValue.contains("sum") || paraValue.contains("group by") || paraValue.contains("asc") || paraValue.contains("desc") || paraValue.contains("order by") || paraValue.contains("char") || paraValue.contains("mid") || paraValue.contains("‘") || paraValue.contains("：") || paraValue.contains("\"") || paraValue.contains("insert") || paraValue.contains("delete from") || paraValue.contains("delete a.* from") || paraValue.contains("drop table") || paraValue.contains("update") || paraValue.contains("truncate") || paraValue.contains("from ") || paraValue

大家在看

最新文章

目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。