在每个组件渲染之前，如何在ReactJs中检查用户是否为loggedIn？

在ReactJs中，我们可以使用条件渲染来检查用户是否为loggedIn。具体的做法是，在每个组件渲染之前，我们可以通过判断用户是否已经登录来决定渲染哪个组件或者显示哪些内容。

一种常见的做法是使用一个高阶组件（Higher-Order Component，HOC）来包装需要进行登录检查的组件。HOC是一个函数，接受一个组件作为参数，并返回一个新的组件。在这个HOC中，我们可以通过检查用户的登录状态来决定渲染哪个组件。

下面是一个示例代码：

import React from 'react';

// 高阶组件，用于检查用户是否为loggedIn
function withAuth(Component) {
  return class extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        loggedIn: false, // 假设初始状态为未登录
      };
    }

    componentDidMount() {
      // 在组件挂载后，可以进行登录状态的检查
      // 这里可以根据实际情况调用后端接口或者读取本地存储等方式来获取登录状态
      const loggedIn = checkLoginStatus(); // 假设checkLoginStatus()函数用于检查登录状态
      this.setState({ loggedIn });
    }

    render() {
      const { loggedIn } = this.state;
      if (loggedIn) {
        // 如果用户已登录，则渲染原始组件
        return <Component {...this.props} />;
      } else {
        // 如果用户未登录，则可以渲染一个登录提示组件或者跳转到登录页面等
        return <div>Please login to view this content.</div>;
      }
    }
  };
}

// 原始组件
class MyComponent extends React.Component {
  render() {
    return <div>Welcome to my app!</div>;
  }
}

// 使用高阶组件包装原始组件
const MyComponentWithAuth = withAuth(MyComponent);

export default MyComponentWithAuth;

在上述示例中，我们定义了一个高阶组件withAuth，它接受一个组件作为参数，并返回一个新的组件。在这个新的组件中，我们在componentDidMount生命周期方法中检查用户的登录状态，并根据登录状态来决定渲染哪个组件。

如果用户已经登录，我们渲染原始组件MyComponent；如果用户未登录，我们可以渲染一个登录提示组件或者跳转到登录页面等。

这样，我们就可以在每个组件渲染之前检查用户是否为loggedIn，并根据需要进行相应的处理。

关于ReactJs的更多信息和学习资源，你可以参考腾讯云的ReactJs产品介绍页面：ReactJs产品介绍。