如何在React中实现Vue类似的组件className props传递功能？

直接用React原生的className props就行，不用自定义props：

• 自定义组件里接收className，并把它传给内部的根元素：

const CustomComp = ({ className }) => {
  return <div className={className} />;
};

• 使用组件的时候直接传className属性，和Vue的:class静态用法一致：

<CustomComp className="new" />

如果需要动态绑定类名（对应Vue的:class动态绑定场景），用JSX表达式即可：

// 根据状态切换类名
const isActive = true;
<CustomComp className={isActive ? "new active" : "new"} />;

// 多条件场景用数组过滤拼接
<CustomComp className={["new", isActive && "active"].filter(Boolean).join(" ")} />;

这样就不用写自定义的customName props，完全贴合你想要的Vue风格用法。

内容的提问来源于stack exchange，提问作者Gokulaselvan