CODEWITHSUNDEEP
javascriptreact-nativeoverlayreact-props
Reez0
Reez0

Reputation: 2689

Invalid prop 'children' of type 'array' supplied to overlay. Expected a single react element

It works just fine, and the other answers I've looked at don't really have a solution which can fit mine. What am I doing wrong?

  <Overlay
  isVisible={this.state.isVisible}
  onBackdropPress={() => this.setState({ isVisible: false })}
>
  {
    this.state.userSlugs.map((l, i) => (
    <WebView key = {i}
    source={{uri: 'https://myurl.com'+l}}
    style={{marginTop: 20}}
    injectedJavaScript={`const meta = document.createElement('meta'); 
    meta.setAttribute('content', 'width=device-width, initial-scale=0.3,
     maximum-scale=0.3, user-scalable=0'); meta.setAttribute('name', 'viewport'); 
     document.getElementsByTagName('head')[0].appendChild(meta); `}
    scalesPageToFit={false}
  />
    ))
  }
</Overlay>

Upvotes: 3

Views: 3384

Answers (2)

sandeep rathod
sandeep rathod

Reputation: 105

adding <> to overlay and </> before closing the overlay, for example:

<Overlay>
<>
.your code or other components
.
.
</>
</Overlay>

Upvotes: -1

Clarity
Clarity

Reputation: 10873

As I mentioned in the comment, you need to wrap your WebView into some container since you're passing an array of children to Overlay, but it expects only one child.

Upvotes: 3

Related Questions