File tree Expand file tree Collapse file tree 2 files changed +59
-1
lines changed Expand file tree Collapse file tree 2 files changed +59
-1
lines changed Original file line number Diff line number Diff line change 5
5
6
6
- add action ` contextMenu `
7
7
8
- ## 2.0.0
8
+ ## 2.0.0 / 2017-09-25
9
9
10
10
- support React 16
11
11
Original file line number Diff line number Diff line change @@ -246,6 +246,64 @@ npm run coverage
246
246
247
247
open coverage/ dir
248
248
249
+ ## React 16 Note
250
+
251
+ Note: If you are using React 16, you won't access popup element's ref in parent component's componentDidMount, which means following code won't work.
252
+
253
+ ``` javascript
254
+ class App extends React .Component {
255
+ componentDidMount () {
256
+ this .input .focus (); // error, this.input is undefined.
257
+ }
258
+
259
+ render () {
260
+ return (
261
+ < Trigger
262
+ action= {[' click' ]}
263
+ popup= {< div>< input ref= {node => this .input = node} type= " text" / >< / div> }
264
+ >
265
+ < button> click< / button>
266
+ < / Trigger>
267
+ )
268
+ }
269
+ }
270
+ ```
271
+
272
+ Consider wrap your popup element to a separate component:
273
+
274
+ ``` javascript
275
+ class InputPopup extends React .Component {
276
+ componentDidMount () {
277
+ this .onMount ();
278
+ }
279
+
280
+ render () {
281
+ return (
282
+ < div>
283
+ < input ref= {this .props .inputRef } type= " text" / >
284
+ < / div>
285
+ );
286
+ }
287
+ }
288
+
289
+ class App extends React .Component {
290
+ handlePopupMount () {
291
+ this .input .focus (); // error, this.input is undefined.
292
+ }
293
+
294
+ render () {
295
+ return (
296
+ < Trigger
297
+ action= {[' click' ]}
298
+ popup= {< InputPopup inputRef= {node => this .input = node} onMount= {this .handlePopupMount } / > }
299
+ >
300
+ < button> click< / button>
301
+ < / Trigger>
302
+ )
303
+ }
304
+ }
305
+ ```
306
+
249
307
## License
250
308
251
309
rc-trigger is released under the MIT license.
You can’t perform that action at this time.
0 commit comments