How do I pass all other attributes in props - ReactJS

Question

const Label = (props) => {
  return <label className={"card-label"} {...props.attributes}>{props.children}</label>;
};

If I try to access the attributes in other functions. I'm getting errors and unable to proceed

<Label attributes={style:{margin:"10px"}}>Select Tip %</Label>

Does anyone know the answer? How do I pass all other attributes of any component with props?

Answer 1

You should put your attributes value into attributes prop as an object:

return <Label className={"card-label"} attributes={{style:{}}}>Select Tip %</Label>;

A more readable way is to extract attributes from props directly:

const Label = ({ attributes, children }) => {
  return <label className={"card-label"} {...attributes}>{children}</label>;
};