Merge pull request #8 from nkbt/Do-not-use-string-refs

Do not use string refs
nkbt · Apr 10, 2016 · fd4c578 · fd4c578
2 parents 0556a20 + 485b4af
commit fd4c578
Showing 1 changed file with 9 additions and 11 deletions.
diff --git a/src/ReactHeight.js b/src/ReactHeight.js
@@ -1,6 +1,5 @@
 /* eslint "react/no-did-mount-set-state":0 */
 /* eslint "react/no-did-update-set-state":0 */
-/* eslint "react/no-string-refs": 0 */
 
 
 import React from 'react';
@@ -29,10 +28,7 @@ const ReactHeight = React.createClass({
 
 
   componentDidMount() {
-    if (!this.refs.wrapper) {
-      return;
-    }
-    const height = this.refs.wrapper.clientHeight;
+    const height = this.wrapper.clientHeight;
     const dirty = false;
 
     this.setState({height, dirty}, () => this.props.onHeightReady(this.state.height));
@@ -50,10 +46,7 @@ const ReactHeight = React.createClass({
 
 
   componentDidUpdate() {
-    if (!this.refs.wrapper) {
-      return;
-    }
-    const height = this.refs.wrapper.clientHeight;
+    const height = this.wrapper.clientHeight;
     const dirty = false;
 
     if (height === this.state.height) {
@@ -64,6 +57,11 @@ const ReactHeight = React.createClass({
   },
 
 
+  setWrapperRef(el) {
+    this.wrapper = el;
+  },
+
+
   render() {
     const {onHeightReady: _, hidden, children, ...props} = this.props;
     const {dirty} = this.state;
@@ -75,12 +73,12 @@ const ReactHeight = React.createClass({
     if (hidden) {
       return (
         <div style={{height: 0, overflow: 'hidden'}}>
-          <div ref="wrapper" {...props}>{children}</div>
+          <div ref={this.setWrapperRef} {...props}>{children}</div>
         </div>
       );
     }
 
-    return <div ref="wrapper" {...props}>{children}</div>;
+    return <div ref={this.setWrapperRef} {...props}>{children}</div>;
   }
 });