How do I pass all other attributes in props

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?

CodePudding user response：

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>;
};

CodePudding user response：

I guess you have a issue with the syntax of passing props to Label component .Try with this

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

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