Assign a value to a variable in JSX for ReactJS
You can create a function outside the render()
that will get correct value:
function getStory(storyObj) {
return storyObj.type === 'story' && storyObj.story ? storyObj.story : storyObj;
}
And then use it in JSX:
{props.stories.map(storyObj =>
<div key={storyObj.id}>
<SliderItem story={getStory(storyObj)} />
</div>
)}
Everything between {}
in the JSX is just JavaScript, so you can do the following:
{props.stories.map((story) => {
const storyObj = (story.type === 'story' && story.story) ? story.story : story;
return (
<div key={story.id}>
<SliderItem story={storyObj} />
</div>
);
})}