Returning multiple elements in JSX
In the lastest react version you can wrap them in an empty fragment:
<>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
</>
If you are using React v16.2.0 and above you can use the shorter version of Fragments
<>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
</>
If you are using a version below React v16 you can only return one element in jsx
, so you have to wrap your elements inside one:
<div>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
</div>
If you are using React v16 and abose you can use Fragments
import React, { Fragment } from 'react';
...
...
<Fragment>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
<NavItem onClick={this.login}>Zaloguj się</NavItem>
<Fragment/>
You could also return an Array of Elements as announced here:
return [
<NavItem key="1" onClick={this.login}>Zaloguj się</NavItem>,
<NavItem key="2" onClick={this.login}>Zaloguj się</NavItem>
];
Depending on your environment you might not be able to use all of these solutions: support for fragments