{props.tasks.join(', ')}
}; diff --git a/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md b/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md index 77865229c9..230e78c457 100644 --- a/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md +++ b/curriculum/challenges/english/03-front-end-libraries/react/pass-props-to-a-stateless-functional-component.english.md @@ -93,7 +93,7 @@ class Calendar extends React.Component { ### After Testif/else statements in JavaScript. They're not quite as robust as traditional if/else statements, but they are very popular among React developers. One reason for this is because of how JSX is compiled, if/else statements can't be inserted directly into JSX code. You might have noticed this a couple challenges ago — when an if/else statement was required, it was always outside the return statement. Ternary expressions can be an excellent alternative if you want to implement conditional logic within your JSX. Recall that a ternary operator has three parts, but you can combine several ternary expressions together. Here's the basic syntax:
-```js
+```jsx
condition ? expressionIfTrue : expressionIfFalse;
```
@@ -200,7 +200,7 @@ class CheckUserAge extends React.Component {
setState() calls into a single update. This means you can't rely on the previous value of this.state or this.props when calculating the next value. So, you should not use code like this:
-```js
+```jsx
this.setState({
counter: this.state.counter + this.props.increment
});
@@ -19,7 +19,7 @@ this.setState({
Instead, you should pass setState a function that allows you to access state and props. Using a function with setState guarantees you are working with the most current values of state and props. This means that the above should be rewritten as:
-```js
+```jsx
this.setState((state, props) => ({
counter: state.counter + props.increment
}));
@@ -27,7 +27,7 @@ this.setState((state, props) => ({
You can also use a form without `props` if you need only the `state`:
-```js
+```jsx
this.setState(state => ({
counter: state.counter + 1
}));
@@ -129,7 +129,7 @@ class MyComponent extends React.Component {