layui 表格内容写temple函数_templet渲染layui表格数据的三种方式

layui前端框架是我一直在使用，也很好用。

今天记录一下，templet渲染layui表格数据的三种方式。

第一种：直接渲染(对于表格数据样式要求不高)

直接在动态表格字段声明，添加templet属性，在其后面加上简单html代码。({{d.name}}这个是layui内置的模板输出){ field: 'name',width: 180,align:"center",title: '用户名',

templet:"

"}},

第二种：先处理数据再显示(适用于数据进一步优化)

在script声明函数，例如下面：将时间戳数据(10位数)改为时间格式function formatDate(timestamp) {

var now = new Date(timestamp*1000);

var year=now.getFullYear();

var month=now.getMonth()+1;

var date=now.getDate();

var hour=now.getHours();

var minute=now.getMinutes();

var second=now.getSeconds();

return year+"-"+month+"-"+date+" "+hour+":"+minute+":"+second;

}

在添加上面执行代码，如下：{ field: 'time',width: 180,align:"center",title: '访问时间',

templet: function (d){

return formatDate(d.time);

}},

最终显示：2019-8-5 18:3:3

第三种：使用layui内置数据模板(适合精美的样式)

直接在动态表格字段声明，添加templet属性，并设置值为要访问script标签的ID{ field: 'status', title: '是否开启',templet: '#statusFun' },

上面那个'#statusFun'，链接的是下面代码：

{{# if(d.status == 1){ }}

开启

{{# } else { }}

开启

{{# } }}

layui 表格内容写temple函数_templet渲染layui表格数据的三种方式相关推荐

layui 表格内容写temple函数_layui表格-template模板的三种用法
问题情境: layui中将数据库数据通过layui table渲染到前端表格,非常简单,但是如果数据库存储的信息不能被直接展示,项目中该页面有好几个这样的字段,会员类型,支付类型,会员时长还有平台类型 ...
layui 表格内容写temple函数_layui 表格内容显示更改
在cole 中使用temple 属性进行修改例: table.render({ elem: '#messageTable' ,id: 'search_table_mId' ,height: 500 ...
layui根据条件显示列_templet渲染layui表格数据的三种方式
layui前端框架是我一直在使用,也很好用. 今天记录一下,templet渲染layui表格数据的三种方式. 第一种:直接渲染(对于表格数据样式要求不高) 直接在动态表格字段声明,添加templet属 ...
【Java基础】IO流概述分类、字节流写数据、字节流写数据的三种方式及写数据的两个小问题
目录一.IO流概述和分类二.字节流写数据三.字节流写数据的三种方式四.字节流写数据的两个小问题一.IO流概述和分类 IO流介绍: ● IO:输入/输出(Input/Output) ● 流:是 ...
字节流写数据的三种方式
写数据的方法分类方法名说明 void write(int b) 将指定的字节写入此文件输出流一次写一个字节数据 void write(byte[] b) 将 b.length字节从指定的字节数组 ...
vue 函数路由跳转_vue中通过路由跳转的三种方式
router-view 实现路由内容的地方,引入组件时写到需要引入的地方需要注意的是,使用vue-router控制路由则必须router-view作为容器. 通过路由跳转的三种方式 1.router ...
JavaScript--------------------jQuery中.bind() .live() .delegate() .on()的区别和三种方式写光棒事件动画...
bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数. $("a").bind("click",function(){alert( ...
python读文件的三种方式_Python｜读、写Excel文件（三种模块三种方式）
python读写excel的方式有很多,不同的模块在读写的讲法上稍有区别: 用xlrd和xlwt进行excel读写: 用openpyxl进行excel读写: import xlrd from xlut ...
痞子衡嵌入式：在IAR开发环境下将关键函数重定向到RAM中执行的三种方法
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家分享的是在IAR开发环境下将关键函数重定向到RAM中执行的三种方法. 嵌入式项目里应用程序代码正常是放在 Flash 中执行的,但有时候也需要将 ...

layui 表格内容写temple函数_templet渲染layui表格数据的三种方式

layui 表格内容写temple函数_templet渲染layui表格数据的三种方式相关推荐

最新文章

热门文章