承接自：JSX详解与实战
非 DOM 属性指的实际上就是 JSX 和 HTML 之间有的一些区别
DOM 上的一些东西 JSX 也是基本上都拥有的，但是在 JSX 中也有一些 DOM 是没有的dangerouslySetInnerHTML 为了保证代码的安全性不被他人注入危险代码
这个是说在开发的时候需要有些东西是要注重安全的，前端是要有安全的意识的 不然就会被别人给注入了
- 示例代码
之后还是编译的那一套东西，下面是编译后的代码片段
ref 替代 JQ 取 ID 获取 DOM 节点
这个是说不要像 Jq 那样去寻找页面的 ID ,React 里面有个 ref ，可以通过这个对应的 ref 在 React 里面完成 DOM 的构建，这个东西在 React 中好用到爆，在 React 中取 ID 的话通过 Jq 是取不到的，所以我们就需要 ref
- 示例代码：
在下面传递时加了 ref 属性，之后就可以在对象的方法中使用this.refs.uname便可以取到这个 DOM 了，这个时一个真实的 DOM 节点，这个 DOM 已经到了页面上了，她并不是 JS 里虚构的对象Key 提高渲染性能
如果不加 key 的话就是上面这样的，假如你修改了 ul 中的 li 一点的地方，他会将所有的 li 再全部都渲染一遍，这样会造成性能很差，所以这个时候就用到了 key ，这个key 也可以到时候你自己去命名
- 示例代码：
加了 key 之后他下次更新的时候就会把这些 key 相等的都相互的对应上，有修改的才会重新去渲染，这样就是最小化的更新了可以有效的提高组建的渲染性能，如下图所示
总结
上面的后面两个 ref 和 key 是 React 开发中非常重要的，也是经常用到的
若有收获，就点个赞吧
0 人点赞
