博客

可以直接对文字样式进行修改，也可以修改默认样式，但为了避免全局修改，需要在外面包裹一层className做限制。在overlayClassName里设置。

<Dropdown
  overlayClassName={styles.dropdown}
  overlay={
    <Menu>
      <Menu.Item key="logout" onClick={logout}>
        <div className={styles.word}>退出登录</div>
      </Menu.Item>
      <Menu.Item key="logout" onClick={handlePersonal}>
        <div className={styles.word}>个人中心</div>
      </Menu.Item>
    </Menu>
  }
  className={styles.account}
>
  <Space>
    <Avatar size={28} src={userInfo.iconUri} />
    <CaretDownOutlined />
  </Space>
</Dropdown>

最后，完成！

.dropdown{
  :global{
    .ant-dropdown-menu-item, .ant-dropdown-menu-submenu-title{
      width: 112px ;
      text-align: center;
      //写入样式
    }
  }
  .word{
    border-bottom: 1px solid #333;
    //写入想要的样式
  }
}