我如何传递道具中的所有其他属性 - ReactJS

Question

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

如果我尝试访问其他函数中的属性。我遇到错误，无法继续

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

有谁知道答案吗？如何使用 props 传递任何组件的所有其他属性？

Answer 1

您应该将您的属性值作为对象放入属性道具中：

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

一种更具可读性的方法是直接从 props 中提取属性：

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

Answer 2

我猜你对将 props 传递给 Label 组件的语法有疑问。试试这个

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

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

我如何传递道具中的所有其他属性 - ReactJS

How do I pass all other attributes in props - ReactJS

reactjs

react-component