LayUI 表格操作列 按钮动态展示
实现方法:
<script type="text/html" id="table-operation">
{{# if(d.orderStatus == '1'){ }}
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="list">
<i class="layui-icon layui-icon-about"></i>列表</a>
{{# if(d.payType == '1'){ }}
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="detail">
<i class="layui-icon layui-icon-edit"></i>详情</a>
{{# } else if(d.payType =='2'){ }}
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="edit">
<i class="layui-icon layui-icon-edit"></i>编辑</a>
{{# } }}
{{# } }}
</script>
// js 模块中
toolbar 和ID相关联 , {title: '操作', minWidth: 200, align: 'center', fixed: 'right', toolbar: '#table-operation'}
鉴于&& 等号解析时错误,第二种 方法
<![CDATA[
{{# if(d.orderStatus == '1' && d.payType == '1' && d.payStatus == "0"){ }} ]]>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="detail"><i
class="layui-icon layui-icon-edit"></i>详情</a>
{{# } }}
<![CDATA[ {{# if(d.payType != '1'){ }}
{{# if(d.orderStatus =='2' || d.orderStatus =='4' || d.orderStatus =='5'){ }} ]]>
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="list"><i
class="layui-icon layui-icon-about"></i>列表</a>
{{# } }}
{{# } }}
层次分析
第一种情况:
{{# if(条件1){ }}
//
{{# } }}
第二种情况
{{# if(d.payType == '1'){ }}
//
{{# } else if(d.payType =='2'){ }}
//
{{# } }}
第三种情况
{{# if(d.orderStatus == '1'){ }}
//
{{# if(d.payType == '1'){ }}
//
{{# } else if(d.payType =='2'){ }}
//
{{# } }}
{{# } }}
end
通过知识/经验的分享,节省开发者的时间.