Skip to content

Commit 2ca7872

Browse files
committed
Use explicit constructor in Draggable to fix IE10 null reference
There's a problem in IE10 with ES2015 classes and the super class. Essentially the prototype isn't set up correctly which leads to this.props being null when setting up position in the construction. However, props are passed to the class constructor explicitly by React, so we can use them from there. Tested by running the examples in IE 10 on Win 7.
1 parent 589bb6a commit 2ca7872

File tree

1 file changed

+23
-13
lines changed

1 file changed

+23
-13
lines changed

lib/Draggable.es6

Lines changed: 23 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,11 @@ type DraggableState = {
1818
isElementSVG: boolean
1919
};
2020

21+
type ConstructorProps = {
22+
position: { x: number, y: number },
23+
defaultPosition: { x: number, y: number }
24+
}
25+
2126
//
2227
// Define <Draggable>
2328
//
@@ -145,22 +150,28 @@ export default class Draggable extends React.Component {
145150
position: null
146151
};
147152

148-
state: DraggableState = {
149-
// Whether or not we are currently dragging.
150-
dragging: false,
153+
state: DraggableState;
151154

152-
// Whether or not we have been dragged before.
153-
dragged: false,
155+
constructor(props: ConstructorProps) {
156+
super(props);
157+
158+
this.state = {
159+
// Whether or not we are currently dragging.
160+
dragging: false,
154161

155-
// Current transform x and y.
156-
x: this.props.position ? this.props.position.x : this.props.defaultPosition.x,
157-
y: this.props.position ? this.props.position.y : this.props.defaultPosition.y,
162+
// Whether or not we have been dragged before.
163+
dragged: false,
158164

159-
// Used for compensating for out-of-bounds drags
160-
slackX: 0, slackY: 0,
165+
// Current transform x and y.
166+
x: props.position ? props.position.x : props.defaultPosition.x,
167+
y: props.position ? props.position.y : props.defaultPosition.y,
161168

162-
// Can only determine if SVG after mounting
163-
isElementSVG: false
169+
// Used for compensating for out-of-bounds drags
170+
slackX: 0, slackY: 0,
171+
172+
// Can only determine if SVG after mounting
173+
isElementSVG: false
174+
};
164175
};
165176

166177
componentWillMount() {
@@ -327,4 +338,3 @@ export default class Draggable extends React.Component {
327338
);
328339
}
329340
}
330-

0 commit comments

Comments
 (0)