这是按钮模板代码,根据status不同渲染不同工具栏

    <script type="text/html" id="btnBar">
      {{# if(d.status === 'active') { }}
      <a class="layui-btn layui-btn-xs" lay-event="wuZiKu-ready">准备完毕</a>
      {{# } else if(d.status === 'inactive') { }}
      <a class="layui-btn layui-btn-xs layui-btn-disabled" lay-event="wuZiKu-ready">准备完        
      </a>
      {{# } }}
    </script>

这是表格代码

    let wuZiKuData = [
        {
          id: 1,
          sign: '1',
          name: '物资库1',
          status: 'active'
        },
        {
          id: 2,
          sign: '2',
          name: '物资库2',
          status: 'inactive'
        },
        {
          id: 3,
          sign: '3',
          name: '物资库3',
          status: 'active'
        }
      ]

     table.render({
        elem: '#wuZiKu-table',
        css: [
          '.layui-table-page{text-align: center;}' // 让分页栏居中
        ].join(''),
        cols: [
          [
            //标题栏
            { field: 'id', hide: true },
            { field: 'sign', title: '编号' },
            { field: 'name', title: '名称' },
            { title: '操作', toolbar: '#btnBar' }
          ]
        ],
        data: wuZiKuData,
        page: true,
        limits: [2],
        limit: 2
      })

就这样啦

Logo

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。

更多推荐