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 相关文章推荐
js实现简单的可切换选项卡效果
Apr 10 Javascript
JS函数定义方式的区别介绍
Mar 22 Javascript
noty ? jQuery通知插件全面解析
May 18 Javascript
JavaScript Ajax编程 应用篇
Jul 02 Javascript
ui-router中使用ocLazyLoad和resolve的具体方法
Oct 18 Javascript
React Native 真机断点调试+跨域资源加载出错问题的解决方法
Jan 18 Javascript
vue前端框架—Mint UI详解(更适用于移动端)
Apr 30 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
Nov 09 Javascript
vue学习笔记之Vue中css动画原理简单示例
Feb 29 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
Sep 22 Javascript
使用react+redux实现计数器功能及遇到问题
Jun 02 Javascript
JS数组去重详情
Nov 07 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 zlib扩展实现页面GZIP压缩输出
2010/06/17 PHP
php在项目中寻找代码的坏味道(综艺命名)
2012/07/19 PHP
ThinkPHP空模块和空操作详解
2014/06/30 PHP
php中使用sftp教程
2015/03/30 PHP
PHP浮点数精度问题汇总
2015/05/13 PHP
PHP进阶学习之反射基本概念与用法分析
2019/06/18 PHP
PHP使用 Imagick 扩展实现图片合成,圆角处理功能示例
2019/09/09 PHP
点击文章内容处弹出页面代码
2009/10/01 Javascript
jQuery最佳实践完整篇
2011/08/20 Javascript
javascript:void(0)的问题使用探讨
2014/04/10 Javascript
Node.js 学习笔记之简介、安装及配置
2015/03/03 Javascript
javascript实现不同颜色Tab标签切换效果
2016/04/27 Javascript
javascript类型系统——undefined和null全面了解
2016/07/13 Javascript
浅谈VUE监听窗口变化事件的问题
2018/02/24 Javascript
JS在if中的强制类型转换方式
2018/07/15 Javascript
js+css3实现炫酷时钟
2020/08/18 Javascript
[43:14]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第二场 8.21
2018/08/22 DOTA
Python中的lstrip()方法使用简介
2015/05/19 Python
通过Python爬虫代理IP快速增加博客阅读量
2016/12/14 Python
python 计算两个日期相差多少个月实例代码
2017/05/24 Python
浅谈用VSCode写python的正确姿势
2017/12/16 Python
windows10环境下用anaconda和VScode配置的图文教程
2020/03/30 Python
pycharm2020.1.2永久破解激活教程,实测有效
2020/10/29 Python
python中xlrd模块的使用详解
2021/02/01 Python
DAWGS鞋官方网站:鞋,凉鞋,靴子
2016/10/04 全球购物
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
致200米运动员广播稿
2014/02/06 职场文书
市级文明单位申报材料
2014/05/07 职场文书
大学生社会实践方案
2014/05/11 职场文书
学习之星事迹材料
2014/05/17 职场文书
人事任命书怎么写
2014/06/05 职场文书
扶贫办主任查摆“四风”问题个人对照检查材料思想汇报
2014/10/02 职场文书
幼儿园万圣节活动总结
2015/05/05 职场文书
入党积极分子培养人意见
2015/06/02 职场文书
如何正确理解python装饰器
2021/06/15 Python
OpenCV项目实践之停车场车位实时检测
2022/04/11 Python