Next.js Discord

Discord Forum

Adding classname to an element

Answered
WhyFencePost posted this in #help-forum
Open in Discord
WhyFencePostOP
<MenuInput className="">Hello</MenuInput> this fails, why can I not do this, and how would I fix that?
Answered by Coffee Coke
const Button: React.FC<React.ButtonHTMLAttributes<HTMLButtonElement>> = (props) => {
  return <button {...props} />;
};

You can use logic like this or just pass custom props
const Button = ({children, classname}: {children: React.ReactNode, classname?: string} ) => {
  return <button className={classname}>{children}</button>;
};
View full answer

2 Replies

@WhyFencePost `<MenuInput className="">Hello</MenuInput>` this fails, why can I not do this, and how would I fix that?
Coffee Coke
const Button: React.FC<React.ButtonHTMLAttributes<HTMLButtonElement>> = (props) => {
  return <button {...props} />;
};

You can use logic like this or just pass custom props
const Button = ({children, classname}: {children: React.ReactNode, classname?: string} ) => {
  return <button className={classname}>{children}</button>;
};
Answer
WhyFencePostOP
thanks