在小程序開(kāi)發(fā)過(guò)程中,我們經(jīng)常會(huì)用到標(biāo)簽中屬性的屬性值,我們通常會(huì)在
此時(shí)可以將代碼替換成這樣來(lái)獲取值
<view bindtap="bintap" data-id="1">view>
bintap:function(e){ var id = e.currentTarget.dataset.id; }
網(wǎng)上還有一直說(shuō)法是 data-* 里 * 命名的問(wèn)題,去掉駝峰式命名,純小寫也能解決
<view> <view> <textarea name="content" bindinput="bindTextAreaChange" maxlength="{{noteMaxLen}}" /> <view class="chnumber">{{noteNowLen}}/{{noteMaxLen}}view> view> view>
data:{ noteMaxLen: 200,//備注最多字?jǐn)?shù) noteNowLen: 0,//備注當(dāng)前字?jǐn)?shù) } //字?jǐn)?shù)改變觸發(fā)事件 bindTextAreaChange: function (e) { var that = this var value = e.detail.value, len = parseInt(value.length); if (len > that.data.noteMaxLen) return; that.setData({ content: value, noteNowLen: len }) },
由于我們使用的是 Bmob 后端云提供的數(shù)據(jù)處理與存儲(chǔ)支持,根據(jù) Bmob 提供的開(kāi)發(fā)文檔,免費(fèi)版的應(yīng)用無(wú)法進(jìn)行模糊查詢,看到這里,再看看已經(jīng)快完工的活動(dòng)檢索界面,感受無(wú)法言說(shuō)。正當(dāng)準(zhǔn)備放棄的時(shí)候,突然想到一個(gè)方法,那就是先把所有的后臺(tái)所有數(shù)據(jù)都存到集合里,然后根據(jù)輸入的檢索值一個(gè)個(gè)匹配,想到之后馬上就開(kāi)始著手干了,先查了一下javaScript 文檔,String 對(duì)象有一個(gè)方法是 indexOf() ,可返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置,這樣就成了,遍歷 所以數(shù)據(jù),檢索每一條數(shù)據(jù)的每個(gè)字符,如果出現(xiàn)了則將它加入到檢索結(jié)果的集合中.
//js 實(shí)現(xiàn)模糊匹配查詢 findEach: function (e) { var that = this var strFind = that.data.wxSearchData.value; //這里使用的 wxSearch 搜索UI插件, if (strFind == null || strFind == "") { wx.showToast({ title: '輸入為空', icon: 'loading', }) } if (strFind != "") { var nPos; var resultPost = []; for (var i in smoodList) { var sTxt = smoodList[i].title || ''; //活動(dòng)的標(biāo)題 nPos = sTxt.indexOf(strFind); if (nPos >= 0) {//如果輸入的關(guān)鍵字在該活動(dòng)標(biāo)題中出現(xiàn)過(guò),則匹配該活動(dòng) resultPost.push(smoodList[i]); //將該活動(dòng)加入到搜索到的活動(dòng)列表中 } } that.setData({ moodList: resultPost }) } },
更加詳細(xì)的代碼請(qǐng)前往Github查看
由于小程序中涉及評(píng)論,加入活動(dòng),收藏等一系列包括事件時(shí)間的功能,而數(shù)據(jù)庫(kù)中存的時(shí)間格式為 2017-11-30 23:36:10 現(xiàn)在想要在界面上不顯示具體時(shí)間,而是顯示與當(dāng)前時(shí)間的差,即幾秒前,幾分鐘前等等
實(shí)現(xiàn)起來(lái)并不復(fù)雜,主要思路是先把字符串的時(shí)間轉(zhuǎn)換成時(shí)間戳,然后與當(dāng)前的時(shí)間戳進(jìn)行比較,這樣就能轉(zhuǎn)換成幾秒前、幾分鐘前、幾小時(shí)前、幾天前等形式了
//字符串轉(zhuǎn)換為時(shí)間戳 function getDateTimeStamp(dateStr) { return Date.parse(dateStr.replace(/-/gi, "/")); } //格式化時(shí)間 function getDateDiff(dateStr) { var publishTime = getDateTimeStamp(dateStr) / 1000, d_seconds, d_minutes, d_hours, d_days, timeNow = parseInt(new Date().getTime() / 1000), d, date = new Date(publishTime * 1000), Y = date.getFullYear(), M = date.getMonth() + 1, D = date.getDate(), H = date.getHours(), m = date.getMinutes(), s = date.getSeconds(); //小于10的在前面補(bǔ)0 if (M < 10) { M = '0' + M; } if (D < 10) { D = '0' + D; } if (H < 10) { H = '0' + H; } if (m < 10) { m = '0' + m; } if (s < 10) { s = '0' + s; } d = timeNow - publishTime; d_days = parseInt(d / 86400); d_hours = parseInt(d / 3600); d_minutes = parseInt(d / 60); d_seconds = parseInt(d); if (d_days > 0 && d_days < 3) { return d_days + '天前'; } else if (d_days <= 0 && d_hours > 0) { return d_hours + '小時(shí)前'; } else if (d_hours <= 0 && d_minutes > 0) { return d_minutes + '分鐘前'; } else if (d_seconds < 60) { if (d_seconds <= 0) { return '剛剛'; } else { return d_seconds + '秒前'; } } else if (d_days >= 3 && d_days < 30) { return M + '-' + D + ' ' + H + ':' + m; } else if (d_days >= 30) { return Y + '-' + M + '-' + D + ' ' + H + ':' + m; } }
在發(fā)布活動(dòng)之后,由于表單中的數(shù)據(jù)沒(méi)有清空,給用戶的體驗(yàn)必定不好,然而小程序的數(shù)據(jù)交互并不像html + jS 那樣,使用 dataSet({}) 來(lái)給賦值,視圖層就能通過(guò)異步的方式活動(dòng)到值,于是想到,在提交表單后,給這些input都賦值為空,那樣就實(shí)現(xiàn)了清空表單的效果,當(dāng)然,表單中并不只包含input,但是都可以通過(guò)這種方式實(shí)現(xiàn)清空效果
<form bindsubmit="submitForm"> <text class="key">活動(dòng)名稱text> <input name="title" maxlength="100" value="{{title}}" /> <button formType="submit">確定button> form>
submitForm:function(e){ var title = e.detail.value.title; ...... success: function (res) { //將title值設(shè)置空 that.setData({ title: '' } } }
由于申請(qǐng)加入活動(dòng)需要填寫真實(shí)姓名,聯(lián)系方式等信息,為了防止用戶隨意填寫信息,必須要對(duì)這些信息進(jìn)行校驗(yàn)
var wxReg = new RegExp("^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$"); //微信號(hào)正則校驗(yàn) var qqReg = new RegExp("[1-9][0-9]{4,}"); //QQ號(hào)正則校驗(yàn) var phReg = /^1[34578]\d{9}$/; //手機(jī)號(hào)正則校驗(yàn) var nameReg = new RegExp("^[\u4e00-\u9fa5]{2,4}$"); //2-4位中文姓名正則校驗(yàn)
在開(kāi)發(fā)過(guò)程中,由于想要實(shí)現(xiàn),當(dāng)用戶報(bào)名成功后如何通知用戶,查閱了小程序的開(kāi)發(fā)文檔發(fā)現(xiàn)有一個(gè)發(fā)送模板消息的API,再查詢 Bmob 的開(kāi)發(fā)文檔,發(fā)現(xiàn)實(shí)現(xiàn)了這個(gè)功能,這個(gè)真的太有用了.模板消息只能再真機(jī)上才能發(fā)送成功,經(jīng)過(guò)配置,重要成功,但是有在使用中出現(xiàn)一個(gè)問(wèn)題
,就是在小程序發(fā)布后 模板消息中如果帶有 page 參數(shù)將不會(huì)發(fā)送,但是在開(kāi)發(fā)版中能發(fā)送成功, 這個(gè)問(wèn)題已經(jīng)反饋了,估計(jì)等Bmob小程序SDK更新后會(huì)解決這個(gè)問(wèn)題.
具體代碼我就不寫了,bmob開(kāi)發(fā)文檔直達(dá)
工作日 8:30-12:00 14:30-18:00
周六及部分節(jié)假日提供值班服務(wù)