String to Component in React — React Technical Interview Questions & Answers

String to Component in React

String to Component in React

  • Map a string to a component: const MAP = { hello: Hello, bye: Bye }; const Comp = MAP[kind] || Fallback; return <Comp />. Don’t eval(). Don’t dangerouslySetInnerHTML untrusted HTML. That’s how widget builders stay safe.
  • String to Component in React — kind=bye → Bye. A dictionary of components is the safe pattern.
  Parent
    │ props (read-only)
    ▼
  Child → UI

Technical Interview Tip: String → component map. Never eval.

Code Examples for String to Component in React

Example

// String to component
const MAP = {
  hello: function Hello() { return <p>Hi</p>; },
  bye: function Bye() { return <p>Bye</p>; },
};

export default function Switch({ kind }) {
  const Comp = MAP[kind] || MAP.hello;
  return <Comp />;
}

String to Component in React — kind=bye → Bye. A dictionary of components is the safe pattern.

How to Explain String to Component in React to an Interviewer

Explain String to Component as if you are teaching a junior — definition, then one tiny UI.

Lookup dictionary. Fallback component.

Write 5–10 lines that use String to Component and say what the UI does.

Show JSX Say the screen

What mistake do freshers make with String to Component?

No eval / random HTML dump.