LayUi数据表格自定义赋值方式


Posted in Javascript onOctober 26, 2019

官方写的非常抽象,反正我是没看懂,可能还没到能看懂前端的级别

自己也是百度的

一开始想去实现一个

用的是

定义表头参数:

{field: 'status', title: '状态', width: 150, templet:'#manager_status',align:'center'}

然后js部分:

<script type="text/html" id="manager_status">
  {{# if(d.status ==1 ){ }}
  <span class="layui-btn layui-btn-xs" style="background: green">启用</span>
  {{# } else { }}
  <span class="layui-btn layui-btn-xs" style="background: red">禁用</span>
  {{# } }}
</script>

但是我发现这个并不友好,比如说我php给他传值,我想用<?=$v['status']?>,你会发现你传到前端的数据都在layui给你定义好的参数data里面,这时候你的data又是死的所以只能通过前端来做变化

LayUi数据表格自定义赋值方式

,{field: 'services', title: '开通服务', width:150, sort: true,align:'center',
  templet:function(d)
  {
    if (d.managerServices.length != 0) {
      services = '';
      // 1:文章,2:问答,3:音频,4:视频'
      $.each(d.managerServices, function (k, v) {
        if (v.service_type == 1){
          services += '文章';
        }
        if (v.service_type == 2){
          services += '/问答';
        }
        if (v.service_type == 3){
          services += '/音频';
        }
        if (v.service_type == 4){
          services += '/视频';
        }
      });
      return services;
    } else {
      return '未开通任何服务';
    }
  }}

以上这篇LayUi数据表格自定义赋值方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
深入理解JavaScript系列(6):S.O.L.I.D五大原则之单一职责SRP
Jan 15 Javascript
js 操作select与option(示例讲解)
Dec 20 Javascript
自己封装的常用javascript函数分享
Jan 07 Javascript
jQuery动画效果图片轮播特效
Jan 12 Javascript
浏览器复制插件zeroclipboard使用指南
Mar 26 Javascript
javascript创建cookie、读取cookie
Mar 31 Javascript
Bootstrap组件学习之导航、标签、面包屑导航(精品)
May 17 Javascript
利用Vue.js指令实现全选功能
Sep 08 Javascript
Websocket协议详解及简单实例代码
Dec 12 Javascript
Vue 单文件中的数据传递示例
Mar 21 Javascript
解读vue生成的文件目录结构及说明
Nov 27 Javascript
js取小数点后两位四种方法
Jan 18 Javascript
layui实现数据表格自定义数据项
Oct 26 #Javascript
layui 数据表格 根据值(1=业务,2=机构)显示中文名称示例
Oct 26 #Javascript
使用 JavaScript 创建并下载文件(模拟点击)
Oct 25 #Javascript
js前端如何写一个精确的倒计时代码
Oct 25 #Javascript
对layui数据表格动态cols(字段)动态变化详解
Oct 25 #Javascript
layui实现数据表格隐藏列的示例
Oct 25 #Javascript
关于在LayUI中使用AJAX提交巨坑记录
Oct 25 #Javascript
You might like
php基础知识:类与对象(1)
2006/12/13 PHP
PHP中的float类型使用说明
2010/07/27 PHP
destoon实现会员商铺中指定会员或会员组投放广告的方法
2014/08/21 PHP
javascript函数中的arguments参数
2010/08/01 Javascript
jQuery示例收集
2010/11/05 Javascript
nodejs win7下安装方法
2012/05/24 NodeJs
使用jQuery内容过滤选择器选择元素实例讲解
2013/04/18 Javascript
Windows8下搭建Node.js开发环境教程
2014/09/03 Javascript
一个通过script自定义属性传递配置参数的方法
2014/09/15 Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
2014/10/17 Javascript
node.js中的fs.fstat方法使用说明
2014/12/15 Javascript
了解Javascript的模块化开发
2015/03/02 Javascript
JS访问SWF的函数用法实例
2015/07/01 Javascript
如何屏蔽防止别的网站嵌入框架代码
2015/08/24 Javascript
JS实现的表格操作类详解(添加,删除,排序,上移,下移)
2015/12/22 Javascript
jQuery的层级查找方式分析
2016/06/16 Javascript
js初始化验证实例详解
2016/11/26 Javascript
Bootstrap3多级下拉菜单
2017/02/24 Javascript
详解vue与后端数据交互(ajax):vue-resource
2017/03/16 Javascript
修改 bootstrap table 默认detailRow样式的实例代码
2017/07/21 Javascript
jquery实现左右轮播切换效果
2018/01/01 jQuery
RequireJS用法简单示例
2018/08/20 Javascript
js判断非127开头的IP地址的实例代码
2020/01/05 Javascript
微信小程序自定义yPicker组件实现省市区三级联动功能
2020/10/29 Javascript
Python文件读取的3种方法及路径转义
2015/06/21 Python
matplotlib实现热成像图colorbar和极坐标图的方法
2018/12/13 Python
Python通用循环的构造方法实例分析
2018/12/19 Python
python f-string式格式化听语音流程讲解
2019/06/18 Python
python使用opencv对图像mask处理的方法
2019/07/05 Python
Python第三方包PrettyTable安装及用法解析
2020/07/08 Python
解决c++调用python中文乱码问题
2020/07/29 Python
美国女性服饰销售网站:Nasty Gal(坏女孩)
2016/07/26 全球购物
商学院大学生求职的自我评价
2014/03/12 职场文书
清明节主题班会
2015/08/14 职场文书
详解Spring Boot使用系统参数表提升系统的灵活性
2021/06/30 Java/Android
Python 中的 copy()和deepcopy()
2021/11/07 Python