CODEWITHSUNDEEP
reactjsreact-component
Samben Jerald
Samben Jerald

Reputation: 117

How do I pass all other attributes in props - ReactJS

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?

Upvotes: 0

Views: 2374

Answers (2)

Abdellah Sabiri
Abdellah Sabiri

Reputation: 396

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

Upvotes: 0

praveen raj
praveen raj

Reputation: 36

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

Upvotes: 1

Related Questions