stop using ReactDOM.findDOMNode in componentWillUnmount, use refs

This commit is contained in:
Michael Telatynski 2019-12-23 12:24:49 +00:00
parent a13ee490e8
commit 17f5849985
3 changed files with 26 additions and 12 deletions

View file

@ -14,8 +14,7 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import ReactDOM from 'react-dom';
import React, {createRef} from 'react';
import PropTypes from 'prop-types';
import createReactClass from 'create-react-class';
@ -90,6 +89,10 @@ module.exports = createReactClass({
};
},
UNSAFE_componentWillMount: function() {
this._avatar = createRef();
},
componentWillUnmount: function() {
// before we remove the rr, store its location in the map, so that if
// it reappears, it can be animated from the right place.
@ -105,7 +108,7 @@ module.exports = createReactClass({
return;
}
const avatarNode = ReactDOM.findDOMNode(this);
const avatarNode = this._avatar.current;
rrInfo.top = avatarNode.offsetTop;
rrInfo.left = avatarNode.offsetLeft;
rrInfo.parent = avatarNode.offsetParent;
@ -125,7 +128,7 @@ module.exports = createReactClass({
oldTop = oldInfo.top + oldInfo.parent.getBoundingClientRect().top;
}
const newElement = ReactDOM.findDOMNode(this);
const newElement = this._avatar.current;
let startTopOffset;
if (!newElement.offsetParent) {
// this seems to happen sometimes for reasons I don't understand
@ -215,6 +218,7 @@ module.exports = createReactClass({
style={style}
title={title}
onClick={this.props.onClick}
inputRef={this._avatar}
/>
</Velociraptor>
);