【移動應(yīng)用開發(fā)技術(shù)】微信小程序開發(fā)遇到的問題有哪些

這篇文章主要介紹了微信小程序開發(fā)遇到的問題有哪些，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓在下帶著大家一起了解一下。

微信小程序開發(fā)完工了，自然也遇到了不少問題，本文我們主要和大家分享微信小程序開發(fā)遇到的問題匯總，希望能幫助到更多的微信開發(fā)者。小程序簡介“讓興趣不再孤單，讓愛好不再流浪”是微信小程序《出發(fā)吧一起》的主題，這款小程序旨在解決當(dāng)代大學(xué)生在校園生活中的孤獨(dú)感，讓大家找到志同道合的朋友，在跑步、健身、競賽等活動中找到伙伴。利用小程序即開即用，用完就走的特點(diǎn)與交友相結(jié)合，它將會是一款高效快捷、無負(fù)擔(dān)的線下交友利器本小程序由bmob后端云提供數(shù)據(jù)處理與存儲支持開發(fā)中技術(shù)問題匯總1.使用e.target.dataset的出現(xiàn)問題在小程序開發(fā)過程中,我們經(jīng)常會用到標(biāo)簽中屬性的屬性值,我們通常會在<view>中設(shè)置data-*="{{XXX}}"然后在JS里通過e.target.dateset.*來獲取XXX值,但是我經(jīng)常遇到獲取的是undefined,使用console.log(e)查看輸出信息會發(fā)現(xiàn),在e對象中包含兩個對象分別是currentTarget和target,而往往有些時候數(shù)據(jù)在currentTarget中,此時可以將代碼替換成這樣來獲取值WXML<view

bindtap="bintap"

data-id="1"></view>JSbintap:function(e){

var

id

=

e.currentTarget.dataset.id;

}網(wǎng)上還有一直說法是data-*里*命名的問題,去掉駝峰式命名,純小寫也能解決2.小程序textarea文本框如何顯示實(shí)時字?jǐn)?shù)WXML<view>

<view>

<textarea

name="content"

bindinput="bindTextAreaChange"

maxlength="{{noteMaxLen}}"

/>

<view

class="chnumber">

{{noteNowLen}}/{{noteMaxLen}}</view>

</view>

</view>JSdata:{

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

})

},3.利用JS實(shí)現(xiàn)模糊查詢由于我們使用的是Bmob后端云提供的數(shù)據(jù)處理與存儲支持，根據(jù)Bmob提供的開發(fā)文檔，免費(fèi)版的應(yīng)用無法進(jìn)行模糊查詢，看到這里，再看看已經(jīng)快完工的活動檢索界面，感受無法言說。正當(dāng)準(zhǔn)備放棄的時候，突然想到一個方法，那就是先把所有的后臺所有數(shù)據(jù)都存到集合里，然后根據(jù)輸入的檢索值一個個匹配，想到之后馬上就開始著手干了，先查了一下javaScript文檔,String對象有一個方法是indexOf(),可返回某個指定的字符串值在字符串中首次出現(xiàn)的位置,這樣就成了,遍歷所以數(shù)據(jù),檢索每一條數(shù)據(jù)的每個字符,如果出現(xiàn)了則將它加入到檢索結(jié)果的集合中.JS//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

||

'';

//活動的標(biāo)題

nPos

=

sTxt.indexOf(strFind);

if

(nPos

>=

0)

{//如果輸入的關(guān)鍵字在該活動標(biāo)題中出現(xiàn)過,則匹配該活動

resultPost.push(smoodList[i]);

//將該活動加入到搜索到的活動列表中

}

}

that.setData({

moodList:

resultPost

})

}

},更加詳細(xì)的代碼請前往Github查看4.使用JS將字符串格式的時間轉(zhuǎn)換成幾秒前,幾分鐘前...由于小程序中涉及評論,加入活動,收藏等一系列包括事件時間的功能,而數(shù)據(jù)庫中存的時間格式為2017-11-3023:36:10現(xiàn)在想要在界面上不顯示具體時間,而是顯示與當(dāng)前時間的差,即幾秒前,幾分鐘前等等實(shí)現(xiàn)起來并不復(fù)雜,主要思路是先把字符串的時間轉(zhuǎn)換成時間戳,然后與當(dāng)前的時間戳進(jìn)行比較,這樣就能轉(zhuǎn)換成幾秒前、幾分鐘前、幾小時前、幾天前等形式了JS//字符串轉(zhuǎn)換為時間戳

function

getDateTimeStamp(dateStr)

{

return

Date.parse(dateStr.replace(/-/gi,

"/"));

}

//格式化時間

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

+

'小時前';

}

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;

}

}5.微信小程序提交表單清空表單數(shù)據(jù)在發(fā)布活動之后,由于表單中的數(shù)據(jù)沒有清空,給用戶的體驗(yàn)必定不好,然而小程序的數(shù)據(jù)交互并不像html+jS那樣,使用dataSet({})來給賦值,視圖層就能通過異步的方式活動到值,于是想到,在提交表單后,給這些input都賦值為空,那樣就實(shí)現(xiàn)了清空表單的效果,當(dāng)然,表單中并不只包含input,但是都可以通過這種方式實(shí)現(xiàn)清空效果WXML<form

bindsubmit="submitForm">

<text

class="key">活動名稱</text>

<input

name="title"

maxlength="100"

value="{{title}}"

/>

<button

formType="submit">確定</button>

</form>JSsubmitForm:function(e){

var

title

=

e.detail.value.title;

success:

function

(res)

{

//將title值設(shè)置空

that.setData({

title:

''

}

}

}6.微信號,QQ號,手機(jī)號正則校驗(yàn)由于申請加入活動需要填寫真實(shí)姓名,聯(lián)系方式等信息,為了防止用戶隨意填寫信息,必須要對這些信息進(jìn)行校驗(yàn)JSvar

wxReg

=

new

RegExp("^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$");

//微信號正則校驗(yàn)

var

qqReg

=

new

RegExp("[1-9][0-9]{4,}");

//QQ號正則校驗(yàn)

var

phReg

=

/^1[34578]\d{9}$/;

//手機(jī)號正則校驗(yàn)

var

nameReg

=

new

RegExp("^[\u4e00-\u9fa5]{2,4}$");

//2-4位中文姓名正則校驗(yàn)7.