INU Login Sign up
Login Or Sign up

Answers for "how to use switch case in react jsx"

Javascript
1

switch in react

renderSwitch(param) {
  switch(param) {
    case 'foo':
      return 'bar';
    default:
      return 'foo';
  }
}

render() {
  return (
    <div>
      <div>
          // removed for brevity
      </div>
      {this.renderSwitch(param)}
      <div>
          // removed for brevity
      </div>
    </div>
  );
}
Posted by: Guest on June-12-2020
0

switch statement react

import * as actionTypes from "../store/actions/actionTypes";

const initialState = {
  counter: 0,
  name: "Ginny",
  tasks: ["cut onion", "drive car"],
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case actionTypes.INCREMENT:
      return {
        ...state,
        counter: state.counter + 1,
      };
    case actionTypes.DECREMENT:
      return {
        ...state,
        counter: state.counter - 1,
      };
    case actionTypes.ADD:
      return {
        ...state,
        counter: state.counter + action.value,
      };
    case actionTypes.ADD_TEN:
      return {
        ...state,
        counter: state.counter + action.payload,
      };
    default:
      return state;
  }
};

export default reducer;
Posted by: Guest on August-19-2021
-1

how to use switch case in react jsx

/* Hint: Use JS IIFE (Immediately invoked function expression) in JSX */

import React from 'react';

import ListView from './ListView';
import TableView from './TableView';

function DataView({
	currView,
	data,
	onSelect,
	onChangeStatus,
	viewTodo,
	editTodo,
	deleteTodo,
}) {
	return (
		<div>
			{(function () {
				switch (currView) {
					case 'table':
						return (
							<TableView
								todos={data}
								onSelect={onSelect}
								onChangeStatus={onChangeStatus}
								viewTodo={viewTodo}
								editTodo={editTodo}
								deleteTodo={deleteTodo}
							/>
						);

					case 'list':
						return (
							<ListView
								todos={data}
								onSelect={onSelect}
								onChangeStatus={onChangeStatus}
								viewTodo={viewTodo}
								editTodo={editTodo}
								deleteTodo={deleteTodo}
							/>
						);

					default:
						break;
				}
			})()}
		</div>
	);
}

export default DataView;
Posted by: Guest on September-02-2021

Code answers related to "how to use switch case in react jsx"

Code answers related to "Javascript"

Browse Popular Code Answers by Language

Python
Javascript
Whatever
Shell/Bash
CSS
Html
PHP
SQL
Java
C#

Popular Programming Languages

Abap ActionScript Assembly BASIC C C# C++ Clojure Cobol CSS Dart Delphi Elixir Erlang F# Fortran Go Groovy Haskell Html Java Javascript Julia Kotlin Lisp Lua Matlab Objective-C Pascal Perl PHP Prolog Python R Ruby Rust Scala Scheme Shell/Bash SQL Swift TypeScript VBA Whatever

Advertisements

290x500

Company

Compilers

Help

Connect with us

footer logo

Copyright © 2021 Codeinu