React.jsライフサイクルについての不明点。

ライフサイクルでつまづいた部分。

ログイン状態をfirebaseで取得し、userでログイン状態を管理し、それで条件分岐し、ボタンの表示をコントロールしようとしているコードの一部です。

js
1class SideNav extends Component {
2  constructor (props) {
3    super(props)
4    this.state = {
5      open: false
6    }
7  }
8
9  componentWillMount() {
10    var config = {
11//hide
12  };
13    firebase.initializeApp(config)
14    var user = firebase.auth().currentUser;
15  };
16
17  handleClose = () => this.setState({ open: false })
18
19  render () {
20    return (
21      <div>
22        <AppBar
23          title='plz donation'
24          iconElementRight={
25            user ? <SideLoginButton />:<LogoutBtn />
26        }
27          onLeftIconButtonTouchTap={() =>
28            this.setState({ open: !this.state.open })}
29        />
30        <Drawer
31          open={this.state.open}
32          docked={false}
33          onRequestChange={open => this.setState({ open })}
34        >
35          <List>
36            {links.map((link, i) => {
37              return (
38                <SideBarItem
39                  isExact={link.isExact}
40                  linkTo={link.linkTo}
41                  primaryText={link.text}
42                  onClick={this.handleClose}
43                  key={i}
44                />
45              )
46            })}
47          </List>
48        </Drawer>
49      </div>
50    )
51  }
52}