遨翔在知识的海洋里----(apicloud之下拉刷新组件)

最新推荐文章于 2024-07-09 19:02:21 发布

weixin_34199335

最新推荐文章于 2024-07-09 19:02:21 发布

阅读量99

点赞数

文章标签： json javascript ViewUI

原文链接：https://juejin.im/post/5acdd20ff265da2391487974

版权

<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>文档</title>
	<link rel="stylesheet" type="text/css" href="../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../css/style.css" />
	<style>
		.empty {
			text-align: center;
			padding: 120px 0;
		}
	</style>
</head>

<body>
	<div class="empty">文档</div>
	<div id="test"></div>
	<script id="testTemplate" type="text/x-dot-template">
		<div><span>{{= it.code}}</span>--<span>{{= it.msg}}</span></div>
		{{~it.data:value:index}}
		<div>
			{{= index+1}}--{{= value.id}}--{{= value.username}}--{{= value.password}}--{{= value.role}}--{{= value.create_time}}
			<div>
				{{~}}
	</script>
</body>

</html>
<script type="text/javascript" src="../script/api.js"></script>
<script src="https://cdn.bootcss.com/dot/1.1.2/doT.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
	apiready = function() {
		refresh()
	}

	function refresh(){
		api.setRefreshHeaderInfo({
			loadingImg: 'widget://image/refresh.png',
			bgColor: '#ccc',
			textColor: '#fff',
			textDown: '下拉刷新...',
			textUp: '松开刷新...'
		}, function(ret, err) {
			//在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
			if (ret) {
				test()
				api.refreshHeaderLoadDone()
			}else{
				console.log(err)
			}
		});
	}

	function test() {
		api.ajax({
			url: 'http://192.168.0.211:3000/userfindAll',
			method: 'get',
		}, function(ret, err) {
			if (ret) {
				var testTemplate = doT.template($("#testTemplate").text());
				$("#test").html(testTemplate(ret));
			} else {
				api.alert({
					msg: JSON.stringify(err)
				});
			}
		})
	}

</script>

复制代码

weixin_34199335

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
遨翔在知识的海洋里----(apicloud之下拉刷新组件)

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-sc
复制链接

扫一扫