EasyUI动态展示用户信息

最新推荐文章于 2024-04-08 13:00:00 发布

不想下火车的人

最新推荐文章于 2024-04-08 13:00:00 发布

阅读量192

点赞数

文章标签： java vue ajax html 小程序

本文链接：https://blog.csdn.net/wuxun1997/article/details/115525902

版权

本文介绍了如何利用EasyUI在前端动态展示用户登录后的用户名和角色信息，实现前后端分离的设计。通过HTML页面调用后台接口getLoginInfo获取数据，使用EasyUI的布局组件在页面顶部展示用户信息。同时，详细说明了如何根据角色的key值处理下拉框选项，并展示了后台Controller的相关接口操作。在用户退出时，调用登出接口并跳转至登录页面。

摘要由CSDN通过智能技术生成

　　业务需求：用户登录后展示用户名、用户对应的角色。EasyUI只不过是一个前端的框架，封装了一些组件和样式，你可以用jsp直接调后台获取到用户信息展示，但我这里想用html页面，用目前流行的说法：前后端分离。效果跟你现在看到的页面右上角差不多，当然功能不同，点击名字不会跳页，当鼠标放在名字可以展示当前用户的角色：

　　实现很简单，html通过easyUI的布局组件region:'north'指定页面顶部展示：

<div class="wu-header" data-options="region:'north',border:false,split:true">
    <div class="wu-header-left">
        <h1>我的台管理系统</h1>
    </div>
    <div class="wu-header-right">
        <p><strong id="userName">admin</strong>&#x