how to use switch case in react jsx

1renderSwitch(param) {
2  switch(param) {
3    case 'foo':
4      return 'bar';
5    default:
6      return 'foo';
7  }
8}
9
10render() {
11  return (
12    <div>
13      <div>
14          // removed for brevity
15      </div>
16      {this.renderSwitch(param)}
17      <div>
18          // removed for brevity
19      </div>
20    </div>
21  );
22}

1/* Hint: Use JS IIFE (Immediately invoked function expression) in JSX */
2
3import React from 'react';
4
5import ListView from './ListView';
6import TableView from './TableView';
7
8function DataView({
9	currView,
10	data,
11	onSelect,
12	onChangeStatus,
13	viewTodo,
14	editTodo,
15	deleteTodo,
16}) {
17	return (
18		<div>
19			{(function () {
20				switch (currView) {
21					case 'table':
22						return (
23							<TableView
24								todos={data}
25								onSelect={onSelect}
26								onChangeStatus={onChangeStatus}
27								viewTodo={viewTodo}
28								editTodo={editTodo}
29								deleteTodo={deleteTodo}
30							/>
31						);
32
33					case 'list':
34						return (
35							<ListView
36								todos={data}
37								onSelect={onSelect}
38								onChangeStatus={onChangeStatus}
39								viewTodo={viewTodo}
40								editTodo={editTodo}
41								deleteTodo={deleteTodo}
42							/>
43						);
44
45					default:
46						break;
47				}
48			})()}
49		</div>
50	);
51}
52
53export default DataView;

1import * as actionTypes from "../store/actions/actionTypes";
2
3const initialState = {
4  counter: 0,
5  name: "Ginny",
6  tasks: ["cut onion", "drive car"],
7};
8
9const reducer = (state = initialState, action) => {
10  switch (action.type) {
11    case actionTypes.INCREMENT:
12      return {
13        ...state,
14        counter: state.counter + 1,
15      };
16    case actionTypes.DECREMENT:
17      return {
18        ...state,
19        counter: state.counter - 1,
20      };
21    case actionTypes.ADD:
22      return {
23        ...state,
24        counter: state.counter + action.value,
25      };
26    case actionTypes.ADD_TEN:
27      return {
28        ...state,
29        counter: state.counter + action.payload,
30      };
31    default:
32      return state;
33  }
34};
35
36export default reducer;
37