mui的app页面使用layui填充数据
在mui的开发中有个坑,mui.plusReady在web上使用时是不会起作用的,只能在app上才行,所以推荐自己测试时使用mui.ready去写加载时的方法。
前端请求的返回格式为json,所以在后端对数据进行了包装处理,在返回后是一层叠一层。
success:function(data){
if(data.data.list.length !== 0){
var list = data.data.list;//提取返回的list数据
layui.use('laytpl', function(){//使用layui提供的laytpl模板
var temp= matterListScript.innerHTML;//向自己的script模板内填充
layui.laytpl(temp).render({list:list},function(html){
matterList.innerHTML = html;//将填充的script放进页面区间
});
});
}else{
mui.alert("暂时没有相关待处理事项","提示","我知道了",function () {
mui.openWindow({
url:"/app/index?sid=${param.sid}"
});
});
}
}
后面是使用layui的方式填充script模板
<script type="text/html" id="matterListScript">
<ul class="pjt-list" id="ulList">
{{# layui.each(d.list,function(index,obj){ }}
<li class="mui-table-view-cell mui-media" id="{{obj.id}}">
<h4 class="ove-title">{{obj.matterName}}</h4>
<span class="pjt-tip">待审核</span>
<div class="bom">
<p>编号:{{obj.matterNo}}</p>
<p style="text-align: right">{{obj.recordCreateTime}}</p>
</div>
</li>
{{# }); }}
</ul>
</script>
自己找的时候也是费了一点力气,开始用的template-web的模板,后面老大说项目之前有layui的填充模板,就又百度和看以前的代码进行修改了。
新人入坑还请多指教,谢谢各位大佬阅读。原文地址:https://www.cnblogs.com/lrz007/p/11341331.html
mui的app页面使用layui填充数据的更多相关文章
- springboot+layui实现PC端用户的增删改查 & 整合mui实现app端的自动登录和用户的上拉加载 & HBuilder打包app并在手机端下载安装
springboot整合web开发的各个组件在前面已经有详细的介绍,下面是用springboot整合layui实现了基本的增删改查. 同时在学习mui开发app,也就用mui实现了一个简单的自动登录和 ...
- HBuilder mui 手机app开发 Android手机app开发 ios手机app开发 打开新页面 预加载页面 关闭页面
创建子页面 在mobile app开发过程中,经常遇到卡头卡尾的页面,此时若使用局部滚动,在android手机上会出现滚动不流畅的问题: mui的解决思路是:将需要滚动的区域通过单独的webview实 ...
- 初入APP(结合mui框架进行页面搭建)
前 言 博主最近在接触移动APP,学习了几个小技巧,和大家分享一下. 1. 状态栏设置 现在打开绝大多数APP,状态栏都是与APP一体,不仅美观,而且与整体协调.博主是个中度强迫症患者,顶部那个 ...
- Python Django CMDB项目实战之-2创建APP、建模(models.py)、数据库同步、高级URL、前端页面展示数据库中数据
基于之前的项目代码来编写 Python Django CMDB项目实战之-1如何开启一个Django-并设置base页index页文章页面 现在我们修改一个文章列表是从数据库中获取数据, 下面我们就需 ...
- 基于Html5 Plus + Vue + Mui 移动App开发(三)-文件操作(读取、保存、更新数据)
随着手机的发展,现在越来越多的人选择在手机上看书.无论是专业书籍.文学.英语还是网络小说,在手机上看新闻成了人们处理零碎时间的办法.在智能手机里安装一个资讯APP,可以随时.随地查看自己想看的资讯 ...
- HTML5+中动态构建列表并填充数据
部分代码参考demo----<历史上的今天>. 感谢作者的分享,愿好人一生平安,虽然只有两个页面,但是通过这个示例让我学会了5+中如何动态构建列表并填充数据,非常实用. html部分: & ...
- mui开发app之联网应用传输数据
手机的app分为,在线和单机,在线就是类似于C/S模式,能与服务器与他人共享数据的程序,单机就是在没有网络下可以玩转的app. 目前互联网盛行的时代,99%的程序都是联网环境下工作的.那么如何开发本地 ...
- 基于Html5 Plus + Vue + Mui 移动App 开发(二)
基于Html5 Plus + Vue + Mui 移动App 开发(二) 界面效果: 本页面采用Html5 Plus + Vue + Mui 开发移动界面,本页面实现: 1.下拉刷新.上拉获取更多功能 ...
- ios&h5混合开发项目仿app页面跳转优化
前言:本人原本是ios开发工程师,但由于现今H5的兴起,行内刮起了一阵混合开发的风气,趁着这股劲,我也学了前端开发,不说研究的多深,但也能胜任日常的开发工作.长话短说,现今的混合开发应该还处于摸索阶段 ...
随机推荐
- ASP.NET Core系列(一): .NET Core简介及安装开发环境
大家都知道Java是跨平台的,.NET因为不具有跨平台的特性,被越来越多的开发者诟病,之前有各种间接的跨平台的方案,比如mono.但是由于各种兼容问题,最终 .NET Core出现了,它可以让程序在W ...
- 【题解】埃及分数-C++
Description 在古埃及,人们使用单位分数的和(形如1/a的, a是自然数)表示一切有理数. 如:2/3=1/2+1/6,但不允许2/3=1/3+1/3,因为加数中有相同的. 对于一个分数a/ ...
- .NET CORE 多语言实现方案
根据市场需求,基于.NET CORE平台开发的RoadFlow工作流平台需要实现多语言版本.经过方案讨论和比对,决定采用.NET自带的本地化功能来实现多语言.话不多说,直接上实现方式. 首先修改Sta ...
- 个人永久性免费-Excel催化剂功能第19波-Excel与Sqlserver零门槛交互-查询篇
对频繁使用Excel的高级应用的尝试用户来说,绕不过的一个问题Excel的性能问题,对于几万条数据还说得过去,上了10万行的数据量,随便一个函数公式的运算都是一个不小的负荷,有些上进一点的用户会往Ac ...
- 基于TCP协议的套接字编程
06.26自我总结 1.关于Socket Socket是应用层与TCP/IP协议族通信的中间软件抽象层,它是一组接口.在设计模式中,Socket其实就是一个门面模式,它把复杂的TCP/IP协议族隐藏在 ...
- C语言入门7-程序设计方法基础-循环结构
程序设计方法基础-循环结构 循环三要素: 初值 循环判断条件 步长(循环增量) 循环结构在有些书籍上也称为重复结构, 即反复执行某一部分的操作. 循环三要素: 初值 循环判断条件 步 ...
- [leetcode] 103 Binary Tree Zigzag Level Order Traversal (Medium)
原题链接 题目要求以"Z"字型遍历二叉树,并存储在二维数组里. 利用BFS,对每一层进行遍历.对于每一层是从左还是从右,用一个整数型判断当前是偶数行还是奇数行就可以了. class ...
- 端口,OSI7层模型,TCP的三次握手和四次挥手,进度条
1.端口: 端口是为了将同一个电脑上的不同程序进行隔离 IP是找电脑,端口是找电脑上的程序 MySQL是一个软件,帮助我们在硬盘上进行文件操作,默认端口是3306 Redis是一个软件,帮助我们在内存 ...
- 《VR入门系列教程》之17---发布第一个应用
发布运行 Unity可以支持多种目标平台的发布,包括:桌面端.Web端.移动端.游戏主机端. 发布运行之前的Cubes场景至桌面端,我们先选择File->Build Settin ...
- python基础之元祖、嵌套,for循环、 enumerate、range的试用案例
元祖又叫做只读列表,可循环查询.可切片,元祖里的直接元素不能更改,但是若里面有嵌套的列表,则可以修改列表里的元素 tu = (1,2,3,'sun',[3,4,5,'cat']) tu[4][3] = ...