react小记

本文介绍了React组件的挂载与卸载过程,并强调了setState的正确使用方式。此外,还讲解了JSX属性名的命名规则及如何避免XSS攻击。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

每当组件第一次加载到DOM中的时候,这在React中被称为挂载

同样,每当组件生成的这个DOM被移除的时候,这在React中被称为卸载。

关于setState()这里有三件事情需要知道

不要直接更新状态

例如,此代码不会重新渲染组件:

// Wrong this.state.comment= ‘Hello’;

应当使用setState():

// Correct this.setState({comment: ‘Hello’});

函数构造的英文唯一能够初始化this.state的地方。

警告:

因为 JSX 的特性更接近 JavaScript 而不是 HTML , 所以 React DOM 使用 camelCase 小驼峰命名 来定义属性的名称,而不是使用 HTML 的属性名称。

例如,class 变成了 className,而 tabindex 则对应着 tabIndex。

JSX 防注入攻击

React DOM 在渲染之前默认会 过滤 所有传入的值。它可以确保你的应用不会被注入攻击。所有的内容在渲染之前都被转换成了字符串。这样可以有效地防止 XSS(跨站脚本) 攻击。

组件的返回值只能有一个根元素。
这里写图片描述

React是非常灵活的,但它也有一个严格的规则:

所有的React组件必须像纯函数那样使用它们的props。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值