FastAdmin数据列表根据某个字段的值动态显示与隐藏按钮

一、需求

在后台管理中，我们有时会遇到根据数据表中某个字段的值来判断显示某个可操作的按钮。

比如一张用户表中，存在一个status字段，在列表显示时，如果该字段的值等于1，显示拉黑按钮，等于2则显示恢复按钮。

二、代码实现

在FastAdmin快速开发框架中，列表数据由相应的JavaScript文件渲染而成，假如控制器为User.php，则此控制对应的JS文件位置在public/assets/js/backend/user/user.js。

在操作一栏添加两个按钮，分别为拉黑和恢复，使用visible函数判断显示与隐藏。

{field: 'operate', title: __('Operate'), table: table, buttons: [
	// 拉黑按钮
    {
        name: 'status1', 
        text: '拉黑', 
        confirm: '确定拉黑该用户吗？',  // 这里使用的是询问框
        title: '拉黑', 
        classname: 'btn btn-xs btn-primary btn-ajax',  // 按钮样式，btn-ajax 代表点击此按钮发送 ajax 请求
        url: '',  // ajax 请求地址
        // 判断该按钮是否显示，row 代表当前行数据
        visible: function (row) {
        	// 判断当前行数据中的 status 字段的值是否等于 1
            if (row.status == 1) {
            	// return true 代表显示
                return true;
            }
        },
        // ajax 请求结束后刷新当前页面
        success: function () {
            $(".btn-refresh").trigger("click");
        }
    },
    {
        name: 'status2', 
        text: '恢复', 
        confirm: '确定恢复该用户吗？', 
        title: '恢复', 
        classname: 'btn btn-xs btn-warning btn-ajax', 
        url: '',
        visible: function (row) {
        	// 判断当前行数据中的 status 字段的值是否等于 2
            if (row.status  == 2) {
                return true;
            }
        },
        success: function () {
            $(".btn-refresh").trigger("click");
        }
    }
 ],
 events: Table.api.events.operate, formatter: Table.api.formatter.operate
}

效果图：

更多参照：一张图解析FastAdmin中的表格列表的功能。

推荐一款开源多端商城系统，LikeShop，科学技术是第一生产力，所有的研发经验，研发心得，讲解说明，我们都乐于分享。为什么选择LikeShop，因为我们努力构建100%开源，极易二次开发，全开放的产品生态。

源码及介绍：点击前往。