1、分頁查詢

 

數據過多怎么辦？一個分頁就解決，麻麻再也不用擔心我的工作啦分頁思路：

把數據放入可滾動視圖區域內，數據過多則視圖可以滾動，當滾到底部的時候觸發hotActivityLoadMore方法帶上頁數請求下一頁數據

 

1. //bindscrolltolower的意思是拉到底部
2.  
3. <scroll-view scroll-y="truze" style="height: 1080rpx;" bindscrolltolower="hotActivityLoadMore">
4.  
5. <view wx:for="{{list}}" wx:for-item="item" >
6.  
7. 循環展示的內容體
8.  
9. </view>
10.  
11. </scroll-view>

js代碼

 

1. // pages/distribution/my_agent.js
2.  
3. var util = require('../../../utils/util.js')
4.  
5. var app = getApp()
6.  
7. Page({
8.  
9. data: {
10.  
11. myAgentList: {
12.  
13. hasMore: true,
14.  
15. list: [],
16.  
17. listSize: 0
18.  
19. },
20.  
21. startNum: 1,//頁數
22.  
23. },
24.  
25. onLoad: function (options) {
26.  
27. //加載頁面
28.  
29. var _that = this
30.  
31. var _url = '請求的地址';
32.  
33. wx.request({
34.  
35. url: _url,
36.  
37. data: [{
38.  
39. id: agentCode,
40.  
41. agentTel: '',
42.  
43. pageNum: 1,//請求第一頁
44.  
45. }],
46.  
47. method: 'post',
48.  
49. success: function (res) {
50.  
51. console.log(res.data)
52.  
53.  
54.  
55. if (res.data.code == '00') {
56.  
57. var listSize = 后臺返回的數據.length;
58.  
59. var newData = _that.data.myAgentList.list;
60.  
61. newData = 后臺返回的數據;
62.  
63. var newList = {};
64.  
65. //當長度小于10表示沒有下頁數據了
66.  
67. if (listSize < 10) {
68.  
69. newList.hasMore = falseo?;
70.  
71. } elseo? {
72.  
73. newList.hasMore = true;
74.  
75. }
76.  
77. newList.list = newData;
78.  
79. newList.listSize = listSize;
80.  
81. _that.seo?tData({ myAgentList: newList });
82.  
83.  
84.  
85. _that.seo?tData({
86.  
87. startNum: 2
88.  
89. })
90.  
91. } else {
92.  
93. util.msg("錯誤", res.data.msg)
94.  
95. console.log("網絡通，數據不成功")
96.  
97. }
98.  
99. },
100.  
101. fail: function (res) {
102.  
103. console.log(res.data)
104.  
105. util.msg("錯誤", "通訊失敗")
106.  
107. }
108.  
109. })
110.  
111. },
112.  
113. hotActivityLoadMore: function (e) {
114.  
115. var _that = this;
116.  
117. //判斷是否還有下一頁
118.  
119. if (_that.data.myAgentList.hasMore == true) {
120.  
121. var pageNum = _that.data.startNum
122.  
123. var _url = '請求的地址';
124.  
125. wx.request({
126.  
127. url: _url,
128.  
129. data: [{
130.  
131. id: agentCode,
132.  
133. linkTel: seek,
134.  
135. pageNum: pageNum //第N頁
136.  
137. }],
138.  
139. method: 'post',
140.  
141. success: function (res) {
142.  
143. console.log(res.data)
144.  
145. if (res.data.code == "00") {
146.  
147. console.log("網絡通，數據成功")
148.  
149. var listSize = 后臺返回的數據.length;
150.  
151. var newData = _that.data.myAgentList.list;
152.  
153. //concat是在原有基礎上進行增加
154.  
155. newData = newData.concat(后臺返回的數據);
156.  
157. var newList = {};
158.  
159. //當長度等于于0表示當前沒有數據，停止
160.  
161. if (listSize == 0) {
162.  
163. newList.hasMore = false;
164.  
165. return;
166.  
167. //當長度小于10表示沒有下頁數據了
168.  
169. } else if (listSize <= 10) {
170.  
171. newList.hasMore = false;
172.  
173. } else {
174.  
175. newList.hasMore = true;
176.  
177. }
178.  
179. newList.list = newData;
180.  
181. newList.listSize = listSize;
182.  
183. _that.setData({ myAgentList: newList });
184.  
185.  
186.  
187. _that.setData({
188.  
189. startNum: pageNum + 1 //頁數加1
190.  
191. })
192.  
193. } else {
194.  
195. util.msg("錯誤", res.data.msg)
196.  
197. console.log("網絡通，數據不成功")
198.  
199. }
200.  
201.  
202.  
203. },
204.  
205. fail: function (res) {
206.  
207. console.log(res.data)
208.  
209. util.msg("錯誤", "通訊失敗")
210.  
211. console.log("失敗")
212.  
213. }
214.  
215. })
216.  
217. }
218.  
219. }
220.  
221. })

 

2、防止用戶多次提交，使用的遮罩層

 

實現很簡單，按鈕加上disabled屬性，用true和false控制。js

 

1. data: {
2.  
3. hidden: true, //等待的展示與隱藏的控制
4.  
5. buthidden: false //按鈕的可用和不可用的控制
6.  
7. }
8.  
9. primary: function (e) {
10.  
11. //顯示等待、禁用按鈕，后臺返回錯誤則將true和false對調一下就是隱藏等待、啟用按鈕
12.  
13. this.setData({
14.  
15. hidden: false,
16.  
17. buthidden: true
18.  
19. })
20.  
21. }

wxml

 

1.  
2.  
3. <loading hidden="{{hidden}}">
4.  
5. 注冊中...
6.  
7. </loading>
8.  
9. <button class="next_step" type="primary" disabled="{{buthidden}}" bindtap="primary">下一步</button>

 

3、切割字符串（很少會用）

 

代碼和js一樣

 

1. var dateList = 需要切割的字符串.split("分隔符");
2.  
3. var arr = []
4.  
5. for (var i in dateList) {
6.  
7. arr = arr.concat(dateList);
8.  
9. console.log(arr)
10.  
11. }

 

4、保留2位小數

 

數據.toFixed(2)

tip：數據必須是數字類型，不能是Str類型

 

5、跳轉傳值

 

在跳轉的時候用kv的形式進行傳值

 

1. <navigator url="../../agent_index?k=v&k=v">
2. </navigator>

第二個頁面在onLoad里面打印options就可以看到上個頁面傳過來的值

 

6、獲取當前定位信息

 

 

1. //自動獲取當前位置
2.  
3. //獲取當前位置經緯度
4.  
5. wx.getLocation({
6.  
7. type: 'wgs84',
8.  
9. success: function (res) {
10.  
11. // 成功返回函數
12.  
13. var longitude = res.longitude
14.  
15. var latitude = res.latitude
16.  
17. //發送請求通過百度經緯度反查地址信息
18.  
19. wx.request({
20.  
21. //百度地圖經緯度反查路徑
22.  
23. url: 'http://api.map.baidu.com/geocoder/v2/?ak=btsVVWf0TM1zUBEbzFz6QqWF&location=' + latitude + ',' + longitude + '&output=json&pois=0',
24.  
25. data: {}, method: "get",
26.  
27. header: { 'Content-Type': 'application/json' },
28.  
29. success: function (ops) {
30.  
31. //成功返回一個result集合
32.  
33. console.log(ops)
34.  
35. //把地址放入需要展示的地方
36.  
37. _that.setData({
38.  
39. merchAddr: ops.data.result.formatted_address
40.  
41. })
42.  
43. }, fail: function () {
44.  
45. util.msg("提示", "定位失敗，請手動輸入店鋪地址")
46.  
47. }
48.  
49. })
50.  
51. }
52.  
53. })
54.