Use Emoji function instead of using JSX

So React doesn’t have to mount/unmount functional components
release
Etienne Lemay 2017-04-23 17:46:24 +02:00
parent d2e37cad6d
commit 0736c65580
2 changed files with 21 additions and 22 deletions

View File

@ -125,24 +125,23 @@ export default class Category extends React.Component {
</div>
{emojis && emojis.map((emoji) =>
<Emoji
key={emoji.id || emoji}
emoji={emoji}
{...emojiProps}
/>
Emoji({
emoji: emoji,
...emojiProps
})
)}
{emojis && !emojis.length &&
<div>
<div>
<Emoji
{...emojiProps}
size={38}
emoji='sleuth_or_spy'
onOver={null}
onLeave={null}
onClick={null}
/>
{Emoji({
...emojiProps,
size: 38,
emoji: 'sleuth_or_spy',
onOver: null,
onLeave: null,
onClick: null,
})}
</div>
<div className='emoji-mart-no-results-label'>

View File

@ -29,11 +29,11 @@ export default class Preview extends React.Component {
return <div className='emoji-mart-preview'>
<div className='emoji-mart-preview-emoji'>
<Emoji
key={emoji.id}
emoji={emoji}
{...emojiProps}
/>
{Emoji({
key: emoji.id,
emoji: emoji,
...emojiProps,
})}
</div>
<div className='emoji-mart-preview-data'>
@ -53,10 +53,10 @@ export default class Preview extends React.Component {
} else {
return <div className='emoji-mart-preview'>
<div className='emoji-mart-preview-emoji'>
{idleEmoji.length > 0 && <Emoji
emoji={idleEmoji}
{...emojiProps}
/>}
{idleEmoji && idleEmoji.length && Emoji({
emoji: idleEmoji,
...emojiProps,
})}
</div>
<div className='emoji-mart-preview-data'>