@@ -47,6 +47,8 @@ export default class SimpleMDEEditor extends React.PureComponent<
47
47
SimpleMDEEditorProps ,
48
48
SimpleMDEEditorState
49
49
> {
50
+ private elementWrapperRef : any ;
51
+
50
52
static defaultProps = {
51
53
events : { } ,
52
54
onChange : noop ,
@@ -91,7 +93,9 @@ export default class SimpleMDEEditor extends React.PureComponent<
91
93
}
92
94
93
95
componentWillUnmount ( ) {
94
- this . removeEvents ( ) ;
96
+ if ( this . editorEl !== null && this . editorEl !== undefined ) {
97
+ this . removeEvents ( ) ;
98
+ }
95
99
}
96
100
97
101
createEditor = ( ) => {
@@ -121,16 +125,11 @@ export default class SimpleMDEEditor extends React.PureComponent<
121
125
} ;
122
126
123
127
addEvents = ( ) => {
124
- const wrapperId = `${ this . id } -wrapper` ;
125
- const wrapperEl = document . getElementById ( `${ wrapperId } ` ) ;
126
-
127
- this . editorEl = wrapperEl ! . getElementsByClassName ( "CodeMirror" ) [ 0 ] ;
128
- this . editorToolbarEl = wrapperEl ! . getElementsByClassName (
129
- "editor-toolbar"
130
- ) [ 0 ] ;
128
+ this . editorEl = this . elementWrapperRef ;
129
+ this . editorToolbarEl = this . elementWrapperRef . getElementsByClassName ( "editor-toolbar" ) [ 0 ] ;
131
130
132
- this . editorEl . addEventListener ( "keyup" , this . eventWrapper ) ;
133
- this . editorEl . addEventListener ( "paste" , this . eventWrapper ) ;
131
+ this . editorEl ! . addEventListener ( "keyup" , this . eventWrapper ) ;
132
+ this . editorEl ! . addEventListener ( "paste" , this . eventWrapper ) ;
134
133
this . editorToolbarEl &&
135
134
this . editorToolbarEl . addEventListener ( "click" , this . eventWrapper ) ;
136
135
@@ -166,6 +165,10 @@ export default class SimpleMDEEditor extends React.PureComponent<
166
165
this . simpleMde ! . codemirror . setOption ( "extraKeys" , this . props . extraKeys ) ;
167
166
}
168
167
} ;
168
+
169
+ private buildWrapperRef = ( e : any ) => {
170
+ this . elementWrapperRef = e ;
171
+ } ;
169
172
170
173
render ( ) {
171
174
const {
@@ -182,7 +185,7 @@ export default class SimpleMDEEditor extends React.PureComponent<
182
185
...rest
183
186
} = this . props ;
184
187
return (
185
- < div id = { `${ this . id } -wrapper` } { ...rest } >
188
+ < div id = { `${ this . id } -wrapper` } { ...rest } ref = { this . buildWrapperRef } >
186
189
{ label && < label htmlFor = { this . id } > { label } </ label > }
187
190
< textarea id = { this . id } />
188
191
</ div >
0 commit comments