layui按钮的权限管控

这里的按钮是指列表最后的操作列，一般会有修改 删除 查看详情等，但并不是每个登录的用户都能看到这些按钮，需要按照动态配置的权限进行管控。

我用的是thymeleaf springboot layui。但我并不想用thymeleaf的模板语言，玩了react后的后遗症是希望能尽量前后端分离，以ajax的方式来完成。说下我的方式：

<script type="text/html" id="column-toolbar">
    <a class="abcdefg" lay-event="user::edit">
        <i class="layui-icon layui-icon-edit" title="编辑"></i>
    </a>
    <a class="abcdefg" lay-event="user::del">
        <i class="layui-icon layui-icon-delete" title="删除"></i>
    </a>
</script>

上面是操作列的工具栏代码 注意那个class=abcdefg，我通过类选择器来进行。

如果是纯html的静态页面，只需要写下面的代码就行：

$(".abcdefg").each(function(){
            if($(this).attr('lay-event')=='user::edit')
                $(this).hide();
        });

在用户登录的时候，将用户的所有可执行的操作全部加载到前台，user::edit是用户的一个权限，写法随意，和冒号没关系。找到lay-event的值，去用户的所有操作用比对，如果没有找到，则hide()。上面代码是简易写法，我还没有去所有权限中做比对。只是确认了确实可以用hide来动态控制。

但当我把这段代码放到正式项目中时却不行了，类选择器一直找不到，我不知道是不是因为我用来thymeleaf的关系，所以解决办法是把上面的这段代码放到layui的table的done的回调函数中。

done: function(res, curr, count){
                $(".abcdefg").each(function(){
                    if($(this).attr('lay-event')=='user::edit')
                        $(this).hide();
                });
            }

这个办法是否真的好用还要继续求证。

另外说下一般的解决方式，就是不考虑前后端分离的情况：

如果后端使用了shiro的安全认证，可以使用shiro的标签来进行控制。具体如下：

<shiro:hasPermission name="user:edit">
            <a lay-event="edit">
                <i title="编辑"></i>
            </a>
        </shiro:hasPermission>

springsecurity也有类似的标签可以使用。

或者使用layui自带的laytpl 语法，具体可百度，我也不熟悉，但确实是可行的。

最后吐槽下react真的挺麻烦，环境搭建，对代码的理解什么的，可能我转不过来。所以才想用layui。easyui虽然真的很强大，但是不太好看，谁让用户只注重外貌呢。