React如何给state.的变量添加样式，让他显示是红色

<ClaaNameA name = “Tom” />

<ClaaNameA name = {Tom} />

<ClaaNameA name = {“Tom”} />

<ClaaNameA name = {[1,2,3]} />//数组

<ClaaNameA name = {FunctionNAme} />//定义一个函数

相信大家对react框架都有了解啦，接下来我们切入正题讲一下我在项目中所遇到的关于state和ref的总结。

1.state

state是状态管理，每次我们需要变更状态时，需要用setState方法来变更。在此之前，我在react中定义任意一个变量，然后通过改变这个变量来记录。

我是通过这个变量来控制className来改变一个部分的背景样式，之前遇到很多类似这样的问题，发现通过其他的变量都不行，变量的值变了，但是效果并不能实现，只能在state中定义才可以实现，后来查了资料并看了官方文档，才发现我对state这个并没有理解，由于背景颜色会变化，这是需要重新触发render函数渲染页面，用setState改变state的状态正好可以重新渲染触发render函数。

2.ref

查了很多资料，对ref这个解释最多的就是 *** 作dom，还是不是很理解，但是后来通过自己去观察，去学习，对ref有了一点点理解。

ref使用在普通的标签上，就是拿到了这个标签元素。

如果ref作用在组件上，对组件进行实例化，可以 *** 纵组件，调用组件内部封装的一些函数。但是注意的是，函数组件不可以使用ref，因为函数组件没有实例。

这些纯粹是我自己做工作过程中对这些的理解啦，也不一定完全正确，希望大家批评指正啦！

---