Skip to content

Commit 94931ae

Browse files
committed
feat(places/SearchBox): support react@^16.0.0
* Use `ReactDOM.createPortal` in `react@^16.0.0` * Closes #640 * Closes #656
1 parent ebb9be8 commit 94931ae

File tree

1 file changed

+35
-11
lines changed

1 file changed

+35
-11
lines changed

src/macros/places/SearchBox.jsx

Lines changed: 35 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -56,20 +56,18 @@ export class SearchBox extends React.PureComponent {
5656
)
5757
this.containerElement = document.createElement(`div`)
5858
this.handleRenderChildToContainerElement()
59-
/*
60-
* @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#SearchBox
61-
*/
62-
const searchBox = new google.maps.places.SearchBox(
63-
this.containerElement.firstChild
64-
)
65-
construct(SearchBox.propTypes, updaterMap, this.props, searchBox)
66-
this.setState({
67-
[SEARCH_BOX]: searchBox,
68-
})
59+
if (React.version.match(/^16/)) {
60+
return
61+
}
62+
this.handleInitializeSearchBox()
6963
}
7064

7165
componentDidMount() {
72-
componentDidMount(this, this.state[SEARCH_BOX], eventMap)
66+
let searchBox = this.state[SEARCH_BOX]
67+
if (React.version.match(/^16/)) {
68+
searchBox = this.handleInitializeSearchBox()
69+
}
70+
componentDidMount(this, searchBox, eventMap)
7371
this.handleMountAtControlPosition()
7472
}
7573

@@ -98,13 +96,33 @@ export class SearchBox extends React.PureComponent {
9896
componentWillUnmount() {
9997
componentWillUnmount(this)
10098
this.handleUnmountAtControlPosition()
99+
if (React.version.match(/^16/)) {
100+
return
101+
}
101102
if (this.containerElement) {
102103
ReactDOM.unmountComponentAtNode(this.containerElement)
103104
this.containerElement = null
104105
}
105106
}
106107

108+
handleInitializeSearchBox() {
109+
/*
110+
* @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#SearchBox
111+
*/
112+
const searchBox = new google.maps.places.SearchBox(
113+
this.containerElement.firstChild
114+
)
115+
construct(SearchBox.propTypes, updaterMap, this.props, searchBox)
116+
this.setState({
117+
[SEARCH_BOX]: searchBox,
118+
})
119+
return searchBox
120+
}
121+
107122
handleRenderChildToContainerElement() {
123+
if (React.version.match(/^16/)) {
124+
return
125+
}
108126
ReactDOM.unstable_renderSubtreeIntoContainer(
109127
this,
110128
React.Children.only(this.props.children),
@@ -132,6 +150,12 @@ export class SearchBox extends React.PureComponent {
132150
}
133151

134152
render() {
153+
if (React.version.match(/^16/)) {
154+
return ReactDOM.createPortal(
155+
React.Children.only(this.props.children),
156+
this.containerElement
157+
)
158+
}
135159
return false
136160
}
137161
}

0 commit comments

Comments
 (0)