二次封装组件如何通过一个参数绑定多个属性

可以通过传入一个对象作为参数，在对象中设置多个属性来实现绑定多个属性的目的。例如：

// 原始组件
function MyComponent(props) {
  return <div style={props.style} className={props.className}>{props.children}</div>;
}

// 二次封装组件
function MyStyledComponent(props) {
  const { style, className, ...rest } = props;
  const myStyle = {
    color: 'red',
    fontSize: '20px',
    ...style // 可以通过...运算符展开传入的style属性
  };
  const myClassName = 'my-class ' + className; // 可以在传入的className基础上添加自定义的类名

  return <MyComponent style={myStyle} className={myClassName} {...rest} />;
}

// 使用方式
<MyStyledComponent style={{backgroundColor: 'yellow'}} className="custom-class">Hello, world!</MyStyledComponent>

在这个例子中，MyStyledComponent组件接受一个props对象作为参数，并从中提取出style和className属性。然后，通过自己定义的样式和类名，将这些属性进行合并，并传递给原始组件MyComponent。在传递时，可以使用...运算符展开rest属性，将其他属性也一并传递给MyComponent。这样，就可以通过一个参数同时绑定多个属性了。