Tree and TreePicker reference

[picasik]

What version of rsuite are you using?

5.0.1

What version of React are you using?

16.13.1

What browser are you using?

Chrome, Firefox

Describe the Bug

<Tree ref={reference}...
reference return node, in rsuite 4.10.2 reference returns TreePicker object

Expected Behavior

reference returns TreePicker object

To Reproduce

v5 - https://codesandbox.io/s/dazzling-parm-924j0?file=/src/App.js
v4 - https://codesandbox.io/s/wispy-cloud-yvhg5?file=/src/App.js

[simonguo]

Hi @picasik
We have improved the Refs to TreePicker and Tree instances in v5.

TreePicker provides open, close and updatePosition methods like other pickers, which is also to satisfy the compromise in certain scenarios. And Tree as a data display component does not require additional methods. We recommend that you directly use the props provided by the component to use it. Don't overuse Refs

[SevenOutman]

@simonguo I think we can provide an innerRef prop for passing out the imperative methods on those components which have this ref breaking change. What do you think?

[simonguo]

@SevenOutman Using innerRef is a solution. If the purpose of innerRef is to get the root element of the component DOM, it can actually be obtained directly through the root property.

rsuite/src/Picker/utils.ts

Lines 571 to 584 in da95b6d

	useImperativeHandle(ref, () => ({
	get root() {
	return rootRef?.current ? rootRef?.current : triggerRef.current?.root;
	},
	get overlay() {
	return overlayRef.current;
	},
	get target() {
	return targetRef?.current;
	},
	updatePosition: handleUpdatePosition,
	open: handleOpen,
	close: handleClose
	}));