javascript - 构建多 View 、多用户类型的 React 应用程序

Question

我无法弄清楚如何创建多用户类型的应用程序。我正在创建一个大项目，我想为买家提供一个不同的 GUI，为卖家提供另一个完全不同的 GUI。我想要这样的东西，如果用户登录并且是买家，则渲染组件A，如果他们是卖家，则渲染组件B。我考虑的方式是检查用户在状态中的类型，然后相应地呈现它。这个方法优化了吗？这实际上可能吗？

我应该创建 2 个“智能”组件，一个为买方，一个为卖方？我真的很困惑任何帮助将不胜感激。 PS:我对 ReactJs 还很陌生

Answer 1

您应该创建一个工厂模式，根据用户类型呈现 Admin 或 Seller 容器或组件(适用于两者):

class LogIn extends React.Component {
  render() {
    if (isLoggedIn) {
      return <LoginFactory {...this.props} />;
    }
    return <LoginForm {...this.props} />
  }
}

function LoginFactory({ userType, ...props }) {
  switch (userType) {
    case 'admin':
      return <Admin {...props} />;
    case 'seller':
      return <Seller {...props} />;
    default:
      return null;
  }
}