浅谈React一操作DOM

hello ，大家中午好，无聊的周末过去了，写代码让我们不在孤单，抽中午吃饭时间给大家分享一下React操作DOM的方法。

一：setSate（第一种方法）

使用setState来进行DOM的刷新，这个方法和小程序的用法是一样的

使用this.setState改变写法是Key，value来写。

二：ReactDOM（第二种方法）

这里咱们需要用到ReactDOM先引入react-dom

改变DOM的方法偏向原生，给DOM绑定class，Id等等！！！

这里咱们绑定了一个Onclik事件

来改变按钮字体的颜色,按钮默认字体颜色是黑色，点击以后会变成red或者是yellow。

字体颜色变换了证明咱们操作DOM实现了！！！

三：ref（第三种方法）

说到ref用过vue的同学应该有所了解ref在vue中也是来获取DOM来操作DOM的，获取this.$refs.key来获取。

React：

获取的时候就有一点不同之处了Vue是this.$refs.key，然后React是this.refs.key就可以

注意：

1：refs是获取组件内部DOM唯一可靠的方法

2：refs会自动销毁对子组件的引用

3：不要在render里面调用因为DOM结构还没生成好也不要在生命中调用

4：不要滥用refs 因为可能会影响性能问题

源码地址： https://github.com/Liingot/react-demo

今天就到这里谢谢大家 溜了溜了