Use a Conditional in a Render Function


#1

Copied the code because I can’t get this module to work. I am stuck, can anyone take a look and see if I am doing this right?

import React from 'react';
import ReactDOM from 'react-dom';

const fiftyFifty = Math.random() < 0.5;

// New component class starts here:
class TonightsPlan extends React.Component{
 render() {
    let task;
    if (fiftyFifty===true) {
      task = 'out WOOO'
    } else {
      task = 'to bed WOOO'
    }

    return <h1>Tonight I'm going{task}!</h1>;
  }
}

#2

the string returned should be an exact match, if we render TonightsPlan we can actually see something:

ReactDOM.render(
	<TonightsPlan />,
	document.getElementById('app')
);

your output:

Tonight I'm goingto bed WOOO!

desired output:

Tonight I'm going to bed WOOO

#3

I actually changed it to this as well. I was stuck on it for so long but thank you for the reply!


#4

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.