Skip to content

How to render a function parameter #4270

Answered by marvinhagemeister
jbbcst asked this question in Q&A
Discussion options

You must be logged in to vote

JSX expects an identifier there and the name must start with an uppercase character to be detected as a component.

  function MyFunction({icon, text, color}) {
+   // Uppercase name so that transpiler can detect that it's a component
+   const IconComponent = icon;
+
     return(
       <span class={`... ${color} `}>    
-       {icon && <{icon} class="w-5 h-5"/>}
+       {IconComponent && <IconComponent class="w-5 h-5"/>}
       <span class="...">{text}</span>
       </span>
     )
  };

Replies: 1 comment 1 reply

Comment options

You must be logged in to vote
1 reply
@jbbcst
Comment options

Answer selected by marvinhagemeister
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Q&A
Labels
None yet
2 participants