Sākums Izpētīt Palīdzība
Pierakstīties
ipu
/
android-share
Vērot 6
Pievienot zvaigznīti 0
Atdalīts 0
Kods Problēmas 1 Izmaiņu pieprasījumi 1 Revīzijas 1214 Laidieni 4 Vikivietne
Pārlūkot izejas kodu

场景演示新增缓存的使用，临时缓存和本地缓存（一次多存多取举例）

chengwb3 8 gadi atpakaļ
vecāks
9b413c6ea0
revīzija
3783a29496
8 mainītis faili ar 426 papildinājumiem un 0 dzēšanām
Dalītais skats Rādīt salīdzināšanas statistiku
  1. 4 0
      display-server/src/main/resources/server-page.xml
  2. 11 0
      display-server/src/main/webapp/biz/js/more/scene/Cache.js
  3. 42 0
      display-server/src/main/webapp/biz/js/more/scene/MemoryCache.js
  4. 42 0
      display-server/src/main/webapp/biz/js/more/scene/OfflineCache.js
  5. 53 0
      display-server/src/main/webapp/template/webapp/more/scene/Cache.html
  6. 133 0
      display-server/src/main/webapp/template/webapp/more/scene/MemoryCache.html
  7. 133 0
      display-server/src/main/webapp/template/webapp/more/scene/OfflineCache.html
  8. 8 0
      display-server/src/main/webapp/template/webapp/more/scene/Scene.html

+ 4 - 0
display-server/src/main/resources/server-page.xml
Parādīt failu 

@ -133,6 +133,10 @@
133 133 
	<action name="SceneBean_DemoDetail" template="template/webapp/more/scene/demo/DemoDetail.html"></action>
134 134 
	<!-- 登录场景 -->
135 135 
	<action name="SceneBean_login_init" template="template/webapp/more/scene/Login.html"></action>
136 
	<!-- 缓存使用场景 -->
137 
	<action name="Cache" template="template/webapp/more/scene/Cache.html"></action>
138 
	<action name="MemoryCache" template="template/webapp/more/scene/MemoryCache.html"></action>
139 
	<action name="OfflineCache" template="template/webapp/more/scene/OfflineCache.html"></action>
136 140 
	<!-- 数据请求场景 -->
137 141 
	<action name="SceneBean_dataRequest" template="template/webapp/more/scene/DataRequest.html"></action>
138 142 
	<!-- 解锁屏场景 -->

+ 11 - 0
display-server/src/main/webapp/biz/js/more/scene/Cache.js
Parādīt failu 

@ -0,0 +1,11 @@
1 
require(["domReady!","mobile","wadeMobile","wmPopup","util"], function(doc,Mobile,WadeMobile,wmPopup) {
2
3 
	$("#MemoryCache").tap(function(){
4 
		Mobile.openTemplate("MemoryCache");
5 
	});
6
7 
	$("#OfflineCache").tap(function(){
8 
		Mobile.openTemplate("OfflineCache");
9 
	});
10
11 
});

+ 42 - 0
display-server/src/main/webapp/biz/js/more/scene/MemoryCache.js
Parādīt failu 

@ -0,0 +1,42 @@
1 
require(["domReady!","mobile","wadeMobile","wmPopup","util"], function(doc,Mobile,WadeMobile,wmPopup) {
2
3 
	init();
4 
	function init(){
5 
		getMemoryCache();
6 
	}
7 
	// 保存
8 
	$("#save").tap(function(){
9 
		var map = new Wade.DataMap();
10 
		map.put("username", $("#username").val());
11 
		map.put("sex", $("#sex").val());
12 
		map.put("age", $("#age").val());
13 
		map.put("dept", $("#dept").val());
14 
		WadeMobile.setMemoryCache(map.toString());//注：需toString()，否则不能解析
15 
		// 也可以使用WadeMobile.setMemoryCache(key, value);
16 
		alert("保存成功！");
17 
	});
18
19 
	// 展示
20 
	$("#show").click(function(){
21 
		getMemoryCache();
22 
	});
23 
	// 获取缓存
24 
	function getMemoryCache(){
25 
		var key = ["username", "sex", "age", "dept"];
26 
		WadeMobile.getMemoryCache(function(data){
27 
			data = typeof(data) == "string" ? new Wade.DataMap(data) : data;
28 
			$("#local_username").val(data.get("username")?data.get("username"):"");
29 
			$("#local_sex").val(data.get("sex")?data.get("sex"):"");
30 
			$("#local_age").val(data.get("age")?data.get("age"):"");
31 
			$("#local_dept").val(data.get("dept")?data.get("dept"):"");
32 
		}, key);
33 
	}
34
35 
	// 删除
36 
	$("#delete").tap(function(){
37 
		var key = ["age", "dept"];
38 
		WadeMobile.removeMemoryCache(key);
39 
		alert("删除成功！");
40 
	});
41
42 
});

+ 42 - 0
display-server/src/main/webapp/biz/js/more/scene/OfflineCache.js
Parādīt failu 

@ -0,0 +1,42 @@
1 
require(["domReady!","mobile","wadeMobile","wmPopup","util"], function(doc,Mobile,WadeMobile,wmPopup) {
2
3 
	init();
4 
	function init(){
5 
		getOfflineCache();
6 
	}
7 
	// 保存
8 
	$("#save").tap(function(){
9 
		var map = new Wade.DataMap();
10 
		map.put("username", $("#username").val());
11 
		map.put("sex", $("#sex").val());
12 
		map.put("age", $("#age").val());
13 
		map.put("dept", $("#dept").val());
14 
		WadeMobile.setOfflineCache(map.toString());//注：需toString()，否则不能解析
15 
		// 也可以使用WadeMobile.setOfflineCache(key, value);
16 
		alert("保存成功！");
17 
	});
18
19 
	// 展示
20 
	$("#show").click(function(){
21 
		getOfflineCache();
22 
	});
23 
	// 获取缓存
24 
	function getOfflineCache(){
25 
		var key = ["username", "sex", "age", "dept"];
26 
		WadeMobile.getOfflineCache(function(data){
27 
			data = typeof(data) == "string" ? new Wade.DataMap(data) : data;
28 
			$("#local_username").val(data.get("username")?data.get("username"):"");
29 
			$("#local_sex").val(data.get("sex")?data.get("sex"):"");
30 
			$("#local_age").val(data.get("age")?data.get("age"):"");
31 
			$("#local_dept").val(data.get("dept")?data.get("dept"):"");
32 
		}, key);
33 
	}
34
35 
	// 删除
36 
	$("#delete").tap(function(){
37 
		var key = ["age", "dept"];
38 
		WadeMobile.removeOfflineCache(key);
39 
		alert("删除成功！");
40 
	});
41
42 
});

+ 53 - 0
display-server/src/main/webapp/template/webapp/more/scene/Cache.html
Parādīt failu 

@ -0,0 +1,53 @@
1 
<!DOCTYPE HTML>
2 
<html class="s_bs">
3 
<head>
4 
	<meta charset="utf-8" />
5 
	<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
6 
	<title>二维码</title>
7 
	{%>template/common/Head.html%}
8 
	<script type="text/javascript" src="biz/js/more/scene/Cache.js" ></script>
9 
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
10 
</head>
11 
<body>
12
13 
<div class="c_navBar">
14 
	<div class="left">
15 
		<div class="back">
16 
			<span class="e_ico-back"></span>
17 
			<span class="text">缓存</span>
18 
		</div>
19 
	</div>
20 
</div>
21
22 
<div class="m_content m_content-nofooter" id="content" >
23 
<div>
24 
	<div class="c_title">缓存分类</div>
25 
	<div class="c_list">
26 
		<ul>
27 
			<li id="date1">
28 
				<div class="content">
29 
					<div class="label">
30 
						<div class="title">临时缓存</div>
31 
						<div class="info">退出应用失效</div>
32 
					</div>
33 
					<div class="value" id="MemoryCache">样例展示</div>
34 
					<div class="more" ></div>
35 
				</div>
36 
			</li>
37 
			<li id="date2">
38 
				<div class="content">
39 
					<div class="label">
40 
						<div class="title">本地缓存</div>
41 
						<div class="info">退出应用不会失效，卸载应用失效</div>
42 
					</div>
43 
					<div class="value" id="OfflineCache">样例展示</div>
44 
					<div class="more" ></div>
45 
				</div>
46 
			</li>
47 
		</ul>
48 
	</div>
49 
</div>
50 
</div>
51
52 
</body>
53 
</html>

+ 133 - 0
display-server/src/main/webapp/template/webapp/more/scene/MemoryCache.html
Parādīt failu 

@ -0,0 +1,133 @@
1 
<!DOCTYPE HTML>
2 
<html class="s_bs">
3 
<head>
4 
	<meta charset="utf-8" />
5 
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
6 
	<title>登陆</title>
7 
	{%>template/common/Head.html%}
8 
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
9 
	<script type="text/javascript" src="biz/js/more/scene/MemoryCache.js"></script>
10
11 
<style>
12 
.ui-input {
13 
	padding: 6px 9px;
14 
	line-height: 0.22rem;
15 
    height: 0.4rem;
16 
	width: 3rem;
17 
	border: 1px solid #BBBBBB;
18 
	font-size: 0.22rem;
19 
    color: #777;
20 
    background: transparent;
21 
    font-size: 0.22rem;
22 
}
23 
.reg_form {
24 
	background-color: #fff;
25 
	font-size: 0.22rem;
26 
	padding-top: 0.12rem;
27 
	box-shadow: 0 0.02rem 0 rgba(0,0,0,0.1);
28 
    line-height: 1;
29 
    border: 1px solid #ccc;
30 
    overflow: hidden;
31 
    background: #fff;
32 
}
33 
.reg_form .reg_table {
34 
}
35 
.reg_form .reg_table td {
36 
	padding: 0 0 8px 0;
37 
	height: 32px;
38 
}
39 
.reg_form .reg_table td label.des {
40 
	text-align: right;
41 
	display: table-cell;
42 
    width: 1.5rem;
43 
    padding: 0.16rem;
44 
    line-height: 0.28rem;
45 
}
46 
.reg_form .reg_table .J_ver-wrap .ui-input {
47 
	width: 2rem;
48 
}
49 
.verifyImg {
50 
	width: 1rem;
51 
	height: 0.4rem;
52 
}
53 
#loginResult span {
54 
	line-height: 0.4rem;
55 
    height: 0.4rem;
56 
}
57 
</style>
58 
</head>
59 
<body>
60 
	<div class="c_navBar">
61 
		<div class="left">
62 
			<div class="back">
63 
				<span class="e_ico-back"></span>
64 
				<span class="text">临时缓存</span>
65 
			</div>
66 
		</div>
67 
	</div>
68
69 
	<div class="m_content m_content-nofooter" id="content">
70 
		<form class="reg_form">
71 
			<table class="reg_table" cellpadding="0" cellspacing="0" border="0" width="100%" id="loginForm">
72 
				<tbody>
73 
					<tr>
74 
						<td width="30%"><label class="des">用户名：</label></td>
75 
						<td><input value="" type="text" id="username" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
76 
					</tr>
77 
					<tr>
78 
						<td width="30%"><label class="des">性别：</label></td>
79 
						<td><input value="" type="text" id="sex" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
80 
					</tr>
81 
					<tr>
82 
						<td width="30%"><label class="des">年龄：</label></td>
83 
						<td><input value="" type="text" id="age" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
84 
					</tr>
85 
					<tr>
86 
						<td width="30%"><label class="des">部门：</label></td>
87 
						<td><input value="" type="text" id="dept" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
88 
					</tr>
89
90 
					<tr>
91 
						<td>&nbsp;</td>
92 
						<td>
93 
							<button class="e_button-ok" id="save" onclick="javascript:return false;">保存</button>
94 
						</td>
95 
					</tr>
96
97 
					<tr>
98 
						<td>&nbsp;</td>
99 
						<td>
100 
							<button class="e_button-ok" id="delete" onclick="javascript:return false;">删除年龄和部门</button>
101 
						</td>
102 
					</tr>
103
104 
					<tr>
105 
						<td>&nbsp;</td>
106 
						<td>
107 
							<button class="e_button-ok" id="show" onclick="javascript:return false;">展示</button>
108 
						</td>
109 
					</tr>
110
111 
					<tr>
112 
						<td width="30%"><label class="des">用户名：</label></td>
113 
						<td><input value="" type="text" id="local_username" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
114 
					</tr>
115 
					<tr>
116 
						<td width="30%"><label class="des">性别：</label></td>
117 
						<td><input value="" type="text" id="local_sex" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
118 
					</tr>
119 
					<tr>
120 
						<td width="30%"><label class="des">年龄：</label></td>
121 
						<td><input value="" type="text" id="local_age" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
122 
					</tr>
123 
					<tr>
124 
						<td width="30%"><label class="des">部门：</label></td>
125 
						<td><input value="" type="text" id="local_dept" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
126 
					</tr>
127 
				</tbody>
128 
			</table>
129
130 
		</form>
131 
	</div>
132 
</body>
133 
</html>

+ 133 - 0
display-server/src/main/webapp/template/webapp/more/scene/OfflineCache.html
Parādīt failu 

@ -0,0 +1,133 @@
1 
<!DOCTYPE HTML>
2 
<html class="s_bs">
3 
<head>
4 
	<meta charset="utf-8" />
5 
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
6 
	<title>登陆</title>
7 
	{%>template/common/Head.html%}
8 
	<link href="biz/css/project.css" rel="stylesheet" type="text/css" />
9 
	<script type="text/javascript" src="biz/js/more/scene/OfflineCache.js"></script>
10
11 
<style>
12 
.ui-input {
13 
	padding: 6px 9px;
14 
	line-height: 0.22rem;
15 
    height: 0.4rem;
16 
	width: 3rem;
17 
	border: 1px solid #BBBBBB;
18 
	font-size: 0.22rem;
19 
    color: #777;
20 
    background: transparent;
21 
    font-size: 0.22rem;
22 
}
23 
.reg_form {
24 
	background-color: #fff;
25 
	font-size: 0.22rem;
26 
	padding-top: 0.12rem;
27 
	box-shadow: 0 0.02rem 0 rgba(0,0,0,0.1);
28 
    line-height: 1;
29 
    border: 1px solid #ccc;
30 
    overflow: hidden;
31 
    background: #fff;
32 
}
33 
.reg_form .reg_table {
34 
}
35 
.reg_form .reg_table td {
36 
	padding: 0 0 8px 0;
37 
	height: 32px;
38 
}
39 
.reg_form .reg_table td label.des {
40 
	text-align: right;
41 
	display: table-cell;
42 
    width: 1.5rem;
43 
    padding: 0.16rem;
44 
    line-height: 0.28rem;
45 
}
46 
.reg_form .reg_table .J_ver-wrap .ui-input {
47 
	width: 2rem;
48 
}
49 
.verifyImg {
50 
	width: 1rem;
51 
	height: 0.4rem;
52 
}
53 
#loginResult span {
54 
	line-height: 0.4rem;
55 
    height: 0.4rem;
56 
}
57 
</style>
58 
</head>
59 
<body>
60 
	<div class="c_navBar">
61 
		<div class="left">
62 
			<div class="back">
63 
				<span class="e_ico-back"></span>
64 
				<span class="text">本地缓存</span>
65 
			</div>
66 
		</div>
67 
	</div>
68
69 
	<div class="m_content m_content-nofooter" id="content">
70 
		<form class="reg_form">
71 
			<table class="reg_table" cellpadding="0" cellspacing="0" border="0" width="100%" id="loginForm">
72 
				<tbody>
73 
					<tr>
74 
						<td width="30%"><label class="des">用户名：</label></td>
75 
						<td><input value="" type="text" id="username" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
76 
					</tr>
77 
					<tr>
78 
						<td width="30%"><label class="des">性别：</label></td>
79 
						<td><input value="" type="text" id="sex" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
80 
					</tr>
81 
					<tr>
82 
						<td width="30%"><label class="des">年龄：</label></td>
83 
						<td><input value="" type="text" id="age" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
84 
					</tr>
85 
					<tr>
86 
						<td width="30%"><label class="des">部门：</label></td>
87 
						<td><input value="" type="text" id="dept" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
88 
					</tr>
89
90 
					<tr>
91 
						<td>&nbsp;</td>
92 
						<td>
93 
							<button class="e_button-ok" id="save" onclick="javascript:return false;">保存</button>
94 
						</td>
95 
					</tr>
96
97 
					<tr>
98 
						<td>&nbsp;</td>
99 
						<td>
100 
							<button class="e_button-ok" id="delete" onclick="javascript:return false;">删除年龄和部门</button>
101 
						</td>
102 
					</tr>
103
104 
					<tr>
105 
						<td>&nbsp;</td>
106 
						<td>
107 
							<button class="e_button-ok" id="show" onclick="javascript:return false;">展示</button>
108 
						</td>
109 
					</tr>
110
111 
					<tr>
112 
						<td width="30%"><label class="des">用户名：</label></td>
113 
						<td><input value="" type="text" id="local_username" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
114 
					</tr>
115 
					<tr>
116 
						<td width="30%"><label class="des">性别：</label></td>
117 
						<td><input value="" type="text" id="local_sex" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
118 
					</tr>
119 
					<tr>
120 
						<td width="30%"><label class="des">年龄：</label></td>
121 
						<td><input value="" type="text" id="local_age" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
122 
					</tr>
123 
					<tr>
124 
						<td width="30%"><label class="des">部门：</label></td>
125 
						<td><input value="" type="text" id="local_dept" name="username" class="ui-input ui-nt" maxlength="20" require="true" /></td>
126 
					</tr>
127 
				</tbody>
128 
			</table>
129
130 
		</form>
131 
	</div>
132 
</body>
133 
</html>

+ 8 - 0
display-server/src/main/webapp/template/webapp/more/scene/Scene.html
Parādīt failu 

@ -37,6 +37,14 @@
37 37 
					</div>
38 38 
				</div>
39 39 
			</li>
40 
			<li action="Cache">
41 
				<div class="content">
42 
					<div class="main">
43 
						<div class="title">缓存</div>
44 
						<div class="info">ipu提供两类缓存：MemoryCache和OfflineCache</div>
45 
					</div>
46 
				</div>
47 
			</li>
40 48 
			<li action="SceneBean_setScreenLock">
41 49 
				<div class="content">
42 50 
					<div class="main">