react中ref使用函数或字符串的区别:String类型的Refs有什么问题

react中ref使用函数或字符串的区别:String类型的Refs有什么问题

摘自:https://zh-hans.reactjs.org/docs/refs-and-the-dom.html

上面一文说「不建议使用它(指String类型的ref属性),因为string类型的refs存在一些问题

我们跳转链接来到github,来看gaearon的回复。

react中ref使用函数或字符串的区别:String类型的Refs有什么问题

举例:

react中ref使用函数或字符串的区别:String类型的Refs有什么问题

说明:

使用string类型的refs存在一些问题:

首先,由于它无法知道this,所以需要React去跟踪当前渲染的组件。这使得React变得比较慢。

其次,见上述例子,string类型的refs写法会让ref被放置在DataTable组件中,而不是MyComponent中。

第三,如果一个库在传递的子组件(子元素)上放置了一个ref,那用户就无法在它上面再放一个ref了。但函数式可以实现这种组合。(这一点我其实不是很能理解gaearon讲的,如果大家能很好的理解,麻烦留言,谢谢了。后面如果遇到这种情况了,我再来补充)