Ant-design-pro: 🐛[BUG]多语言切换时AvatarDropdown组件下拉项未变化

Created on 29 Oct 2019 · 2Comments · Source: ant-design/ant-design-pro

🐛 bug 描述

在使用 umi 创建的 antd-pro 项目中，在 GlobalHeader 组件中的 AvatarDropdown 组件在多语言切换时未进行语言的切换，刷新后则显示正常。

📷 复现步骤

使用 create-umi 进行项目搭建；
$ yarn 进行依赖安装；
启动项目，进入到 BasicLayout 布局页面；
查看 AvatarDropdown 下拉，切换多语言后，再次查看 AvatarDropdown 下拉，发现并未按所选语言进行切换；
刷新当前页面后，显示正常。

🏞 期望结果

在进行多语言切换时， AvatarDropdown 组件下拉项可以准确实时地进行语言的切换。

💻 复现代码

onMenuClick = (event: ClickParam) => {
    const { key } = event;

    if (key === 'logout') {
      removeToken()
      router.push('/user/login')
      return;
    }
    router.push(`/account/${key}`);
  };

  render(): React.ReactNode {
    const { currentUser = { avatar: '', name: '' }, menu } = this.props;
    console.log(currentUser)

    const menuHeaderDropdown = (
      <Menu className={styles.menu} selectedKeys={[]} onClick={this.onMenuClick}>
        {menu && (
          <Menu.Item key="center">
            <Icon type="user" />
            <FormattedMessage id="menu.account.center" defaultMessage="account center" />
          </Menu.Item>
        )}
        {menu && (
          <Menu.Item key="settings">
            <Icon type="setting" />
            <FormattedMessage id="menu.account.settings" defaultMessage="account settings" />
          </Menu.Item>
        )}
        {menu && <Menu.Divider />}

        <Menu.Item key="logout">
          <Icon type="logout" />
          <FormattedMessage id="menu.account.logout" defaultMessage="logout" />
        </Menu.Item>
      </Menu>
    );

    return currentUser && currentUser.name ? (
      <HeaderDropdown overlay={menuHeaderDropdown}>
        <span className={`${styles.action} ${styles.account}`}>
          <Avatar size="small" className={styles.avatar} src={currentUser.avatar} alt="avatar" />
          <span className={styles.name}>{currentUser.name}</span>
        </span>
      </HeaderDropdown>
    ) : (
      <Spin size="small" style={{ marginLeft: 8, marginRight: 8 }} />
    );
  }