小程序開發(fā)過(guò)程中遇到的問(wèn)題(關(guān)于小程序開發(fā)的問(wèn)題)
今天給各位分享小程序開發(fā)過(guò)程中遇到的問(wèn)題的知識(shí),其中也會(huì)對(duì)關(guān)于小程序開發(fā)的問(wèn)題進(jìn)行解釋,如果能碰巧解決你現(xiàn)在面臨的問(wèn)題,別忘了關(guān)注本站,現(xiàn)在開始吧!
本文目錄一覽:
- 1、微信小程序開發(fā)中遇到的坑及解決辦法
- 2、小程序開發(fā)經(jīng)驗(yàn)總結(jié)
- 3、小程序開發(fā)過(guò)程中,作為開發(fā)者你遇到最大的挑戰(zhàn)是什么?
- 4、小程序開發(fā)注意事項(xiàng)
- 5、開發(fā)微信小程序需要注意什么
- 6、小程序開發(fā)的難點(diǎn)是什么?
微信小程序開發(fā)中遇到的坑及解決辦法
taro單獨(dú)為某個(gè)項(xiàng)目切換taro版本環(huán)境
單獨(dú)為某一個(gè)項(xiàng)目升級(jí)#這樣做的好處是全局的 Taro 版本還是 1.x 的,多個(gè)項(xiàng)目間的依賴不沖突,其余項(xiàng)目依然可以用舊版本開發(fā)。 如果你的項(xiàng)目里沒(méi)有安裝 Taro CLI,你需要先裝一個(gè):
# 如果你使用 NPM
$ npm install --save-dev @tarojs/cli@2.x
# 如果你使用 Yarn
$ yarn add -D @tarojs/cli@2.x
echarts在小程序中滑動(dòng)卡頓
由于微信小程序中,echarts的層級(jí)最高,無(wú)論設(shè)置多大層級(jí)也無(wú)法遮住echarts。而且小程序中好像只能用echarts吧。所以為了解決這個(gè)bug,我只能委屈求全了。打開ec-canvas.wxml文件,將touchStart、touchMove和touchEnd去掉了,直接刪除就好啦。這三個(gè)事件應(yīng)該是做縮放的吧,我們也沒(méi)有這個(gè)縮放的需求。所以就去掉了。雖然暫時(shí)滿足的需求,還是沒(méi)有真正的解決問(wèn)題。
原:
bindinit="init"
bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}"
bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}"
bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"
現(xiàn):
bindinit="init"
echarts在小程序中無(wú)法跟隨頁(yè)面滑動(dòng)
在卡頓問(wèn)題中能與echarts交互少的,可以直接使用圖片代替cannvas,即在echarts渲染完畢后將它替換為一張圖片。
如果我更新了數(shù)據(jù),那么就重新放出echarts,等它渲染完畢后,再次替換為一張圖片。
chart.on('finished', () = {
getCurrentInstance().page.selectComponent(id).canvasToTempFilePath({
success: res = {
console.log('res.tempFilePath====',res.tempFilePath)
this.setState({
echartImgSrc: res.tempFilePath
? ? ? })
},
? ? fail: res =console.log('轉(zhuǎn)換圖片失敗', res)
});
})
render:
this.state.echartImgSrc =='' ?
? ref={this.refChart}
id={this.state.id}
canvas-id="mychart-area"
? force-use-old-canvas="true"
? ec={this.state.ec}
/
:
CoverImage src={this.state.echartImgSrc}/CoverImage
小程序開發(fā)經(jīng)驗(yàn)總結(jié)
最近一直在做小程序,工作中也遇到了一些問(wèn)題,踩了一些坑,所以想著寫篇文章記錄下來(lái),并借此將小程序開發(fā)的相關(guān)知識(shí)進(jìn)行梳理,方便以后參考,也為剛剛接觸小程序的人提供一些思路方法,互相學(xué)習(xí),共同進(jìn)步。
1、微信小程序的目錄結(jié)構(gòu)及配置說(shuō)明
app.json是小程序的全局配置文件,所有配置項(xiàng)key必須使用 雙引號(hào)括起來(lái) ,value值為字符串類型的也必須使用雙引號(hào), 不支持單引號(hào) 。
1.1 pages
pages選項(xiàng)是必須配置的。該配置項(xiàng)注冊(cè)了小程序所有頁(yè)面的地址,其中每一項(xiàng)都是頁(yè)面的 路徑+文件名 。每一個(gè)頁(yè)面都是由.json、.js、.wxml、.wxss四個(gè)文件組成,并且 四個(gè)文件的名字必須要一致 。
1.2 ? tabBar
tabBar 配置項(xiàng)指定 tab 欄的表現(xiàn),以及 tab 切換時(shí)顯示的對(duì)應(yīng)頁(yè)面。其中 list 接受一個(gè)數(shù)組,只能配置最少 2 個(gè)、最多 5 個(gè) tab
1.3?usingComponents
使用自定義組件或者插件提供的組件前,必須先在這里聲明
2、開發(fā)微信小程序遇到的問(wèn)題及解決辦法
2.1 雙向綁定
微信小程序不支持通過(guò)v-model的方式實(shí)現(xiàn)自動(dòng)雙向綁定,需要給表單元素通過(guò)綁定事件,并使用this.setData來(lái)賦值實(shí)現(xiàn)。
2.2 computed和watch
微信小程序默認(rèn)是不支持computed和watch的,如需要使用這兩項(xiàng)功能,需要安裝miniprogram-computed ,安裝方法見 官方文檔
2.3 對(duì)象賦值
如果給對(duì)象的屬性賦值,可以使用this.setData({'obj.key':value})來(lái)賦值,但是如果給某個(gè)屬性名是變量的屬性賦值,通過(guò)這種方法是會(huì)報(bào)錯(cuò)的,經(jīng)過(guò)多次嘗試,發(fā)現(xiàn)使用如下的方式賦值成功。
let newObj = `obj.${key}`
this.setData({
[newObj]: value
})
2.4 scroll-view
當(dāng)頁(yè)面存在彈框容器,并且彈框里的內(nèi)容是需要滾動(dòng)條滾動(dòng)展示時(shí),如果彈框下面那層的容器使用view元素的話,會(huì)導(dǎo)致滾動(dòng)彈框內(nèi)容時(shí),同時(shí)會(huì)觸發(fā)彈框下面那層的頁(yè)面容器也會(huì)一起滾動(dòng),解決此問(wèn)題可以將彈框下面的容器使用scroll-view元素替代view元素
3、小程序測(cè)試和發(fā)布
由于服務(wù)器域名request合法域名每個(gè)月 只能修改5次 ,因此在本地開發(fā)小程序時(shí),需要在微信調(diào)試工具中設(shè)置不校驗(yàn)合法域名。等小程序上線前再一次性將所有域名添加到小程序管理后臺(tái)。
以上便是此次小程序開發(fā)中積累的一些經(jīng)驗(yàn),希望能給剛剛接觸小程序的人提供一些思路方法,在以后的開發(fā)中,如果遇到新的問(wèn)題,繼續(xù)更新文檔......
小程序開發(fā)過(guò)程中,作為開發(fā)者你遇到最大的挑戰(zhàn)是什么?
做小程序開發(fā)大概半年了,我來(lái)說(shuō)說(shuō)體會(huì)吧。
第一:模擬器顯示與真機(jī)不一致問(wèn)題,在模擬器上一切正常,到了真機(jī)上各種問(wèn)題。
第二:基礎(chǔ)庫(kù)升級(jí),它基礎(chǔ)庫(kù)說(shuō)升級(jí)就升級(jí),讓你措手不及,印象最深的兩個(gè)點(diǎn)是獲取用戶信息和關(guān)注公眾號(hào)問(wèn)題。尤其是關(guān)注公眾號(hào)問(wèn)題,由于業(yè)務(wù)需要讓用戶綁定公眾號(hào),又一次審核還被拒,原因就是“誘導(dǎo)關(guān)注”現(xiàn)在好了,官方直接給你提供組件讓你去關(guān)注公眾號(hào),當(dāng)時(shí)看到這個(gè)心里一萬(wàn)頭羊駝在奔騰。
第三:官方的IDE真的不好用,用起來(lái)真心累,現(xiàn)在我使用的是VSCODE + TypeScript進(jìn)行開發(fā)。
希望能幫到題主,祝新年快樂(lè)~
小程序開發(fā)注意事項(xiàng)
1. 開發(fā)小程序時(shí),每個(gè)頁(yè)面一定要在app.json文件中注冊(cè),頁(yè)面文件夾和其包含的四個(gè)文件的名字要保持一致。
2. 小程序發(fā)起的都是HTTPS網(wǎng)絡(luò)請(qǐng)求,在開發(fā)調(diào)試的過(guò)程中可以不校驗(yàn)協(xié)議和TLS版本,但在實(shí)際上線后必須進(jìn)行HTTPS協(xié)議通信。
3. 小程序可以進(jìn)行組件化開發(fā)以及數(shù)據(jù)綁定,所有對(duì)于DOM的操作都是基于數(shù)據(jù)驅(qū)動(dòng)的,并沒(méi)有直接進(jìn)行DOM操作的做法,換言之,小程序內(nèi)沒(méi)有document對(duì)象,原生js和jQuery里的DOM操作思維要舍棄掉。
4. 小程序的網(wǎng)絡(luò)請(qǐng)求wx.request()是不自帶Cookies的,這和瀏覽器上的網(wǎng)絡(luò)請(qǐng)求不同,因此基于Cookies實(shí)現(xiàn)的會(huì)話管理不適用于小程序。
5. 小程序的腳本文件中,內(nèi)置對(duì)象是page,而非傳統(tǒng)瀏覽器里的window,因此所有基于window對(duì)象來(lái)寫的庫(kù)(例如jQuery)都不適用于小程序。
6. 小程序提供模板功能,模板擁有自己的作用域,它只能使用從data屬性傳入的數(shù)據(jù)。
7. 每一個(gè)頁(yè)面文件夾下的.json文件是用來(lái)寫配置項(xiàng)的,如果該頁(yè)面無(wú)需添加相關(guān)配置,.json文件也要寫上一對(duì)大括號(hào)(“{ }”),否則會(huì)報(bào)錯(cuò)。
8. 在同一個(gè)tab里的頁(yè)面可以跳轉(zhuǎn),并且允許攜帶參數(shù)。不同tab的頁(yè)面之間無(wú)法跳轉(zhuǎn),使用wx.navigateTo()接口會(huì)報(bào)錯(cuò)。同時(shí),tab之間的跳轉(zhuǎn)可以用wx.switchTab()實(shí)現(xiàn),但是路徑后不能帶參數(shù)。
9. 腳本文件里data的數(shù)據(jù),在更新的時(shí)候要通過(guò)this.setData()方法來(lái)更新,而不能直接用“=”來(lái)做。
10. 在組件標(biāo)簽里,可以通過(guò)“data-屬性值”的方式綁定我們需要的數(shù)據(jù),然后在事件內(nèi)置event對(duì)象里進(jìn)行獲取。
11. 小程序里也存在事件的冒泡,具體的冒泡事件可以參考官方文檔,如果希望事件向上冒泡,則使用bind來(lái)綁定事件,若希望阻止事件冒泡,就使用catch來(lái)進(jìn)行事件綁定。
12. 小程序支持文件引用,有import和include兩種方式,import有作用域,也就是引入的目標(biāo)文件里import的模板不會(huì)被引入;而include等于是將目標(biāo)文件除 以外的整個(gè)代碼進(jìn)行引入。
13. wx.login()和wx.getUserInfo()是兩個(gè)獨(dú)立的接口,前者可以實(shí)現(xiàn)用戶登錄,這個(gè)過(guò)程是悄無(wú)聲息的,不需要用戶授權(quán),登錄后可以拿到用戶的openid和session_key;而wx.getUserInfo()可以拿到用戶的具體信息,這個(gè)過(guò)程需要獲得用戶的授權(quán),開發(fā)時(shí)也必須考慮用戶拒絕授權(quán)的場(chǎng)景。
14. 目前小程序可以分享給微信好友和微信群,但小程序默認(rèn)是沒(méi)有這個(gè)功能的,只有在Page里定義了onShareAppMessage事件處理函數(shù),點(diǎn)擊小程序右上角才可以看到分享按鈕。
開發(fā)微信小程序需要注意什么
近幾年小程序市場(chǎng)發(fā)展形勢(shì)大好,很多商家在剛接觸小程序開發(fā)時(shí)有很多疑惑,小程序開發(fā)的核心到底有哪些?我們需要注意哪些問(wèn)題?
1、定位
不同的行業(yè)的定位自然不同。如果企業(yè)在開發(fā)前沒(méi)有一個(gè)明確的定位,不僅會(huì)讓開發(fā)過(guò)程變得麻煩復(fù)雜,也不方便后期運(yùn)營(yíng)。所以企業(yè)做好精準(zhǔn)定位是必不可少的,考慮好制作小程序是為了展示還是營(yíng)銷、市場(chǎng)和用戶定位是什么等等相關(guān)問(wèn)題。
2、功能需求
小程序所具備的功能是制作小程序的核心要點(diǎn),這要求企業(yè)在開發(fā)前就要想好自己希望這個(gè)小程序往哪方面發(fā)展、小程序的細(xì)分功能需求是什么、小程序的頁(yè)面布局、是否需要配置各種營(yíng)銷功能,想要實(shí)現(xiàn)什么樣的運(yùn)營(yíng)轉(zhuǎn)化等等。不要等到后期運(yùn)營(yíng)的時(shí)候,才發(fā)現(xiàn)這個(gè)功能是有所缺失的。所以,在小程序開發(fā)的之前,企業(yè)必須充分考慮好每一個(gè)所需的功能。才能讓開發(fā)效果更好,讓小程序上線后更具同行競(jìng)爭(zhēng)力。
3、優(yōu)化路徑
大家都知道小程序的“輕而美”是小程序的特點(diǎn),正是因?yàn)樾〕绦蛩哂袩o(wú)需下載安裝、不占內(nèi)存、即用即走的這些特點(diǎn)才讓裂變式分享變得簡(jiǎn)單易實(shí)現(xiàn),同時(shí)也讓客戶留存變得有難度,怎么樣讓用戶走了再來(lái)常來(lái)也成了很多小程序運(yùn)營(yíng)者的新難題。所以建議無(wú)論是功能設(shè)計(jì)還是頁(yè)面設(shè)計(jì)一定要簡(jiǎn)潔明了,不要企圖做得和APP一樣華麗復(fù)雜,讓用戶按照容易上手的路徑往下走,通過(guò)最少的路徑步驟去達(dá)成用戶體驗(yàn),才能提高流量轉(zhuǎn)化和用戶留存率。
4、使用場(chǎng)景
商家要結(jié)合自身的實(shí)際情況去盡可能的增加小程序的使用場(chǎng)景,以此來(lái)提高用戶的使用頻率。比如餐飲行業(yè),除了提供堂食點(diǎn)餐/外賣的核心服務(wù)外,還可以增加會(huì)員充值、積分商城、會(huì)員暗號(hào)福利,團(tuán)餐預(yù)定等多項(xiàng)服務(wù),當(dāng)用戶第一次進(jìn)入小程序完成瀏覽時(shí)就大概記住商家能夠提供的服務(wù)內(nèi)容,在下次有需求時(shí)自然會(huì)再次了解使用,這樣就實(shí)現(xiàn)了提高復(fù)購(gòu)和下單頻率。
以上就是商城小程序開發(fā)核心的內(nèi)容分享,當(dāng)然除了這些,選擇有實(shí)力的服務(wù)商和選擇合理的預(yù)算成本也是商家需要考慮的方面,以上內(nèi)容希望對(duì)大家能夠有所幫助。
小程序開發(fā)的難點(diǎn)是什么?
小程序開發(fā)的難點(diǎn)有:如何通過(guò)技術(shù)手段提升開發(fā)效率以應(yīng)對(duì)不斷增長(zhǎng)的業(yè)務(wù)需求?微信小程序的工程化探索有哪些最新進(jìn)展?如何實(shí)現(xiàn)小程序自動(dòng)化構(gòu)建、自動(dòng)化測(cè)試?
如何將小程序開發(fā)與團(tuán)隊(duì)現(xiàn)有的技術(shù)棧有機(jī)結(jié)合?如何適配 H5、React Native微信小程序等多端需求?如何擴(kuò)展小程序的能力、滿足產(chǎn)品設(shè)計(jì)上的復(fù)雜需求?如何突破小程序包大小的限制?
如何解決頁(yè)面層級(jí)限制問(wèn)題?在遇到長(zhǎng)列表場(chǎng)景時(shí),小程序渲染性能會(huì)出現(xiàn)瓶頸,如何進(jìn)行性能優(yōu)化?由于微信小程序中缺少對(duì) DOM 的控制,該如何滿足復(fù)雜交互需求?【點(diǎn)擊查看小程序開發(fā)底價(jià)】
想要了解更多有關(guān)小程序開發(fā)的相關(guān)信息,推薦咨詢豬八戒網(wǎng)。豬八戒網(wǎng)成立于2006年,是中國(guó)領(lǐng)先的企業(yè)服務(wù)平臺(tái),服務(wù)交易獨(dú)角獸企業(yè)。豬八戒網(wǎng)現(xiàn)有注冊(cè)用戶2800萬(wàn)、在全國(guó)布局線下數(shù)字化創(chuàng)業(yè)園區(qū)超過(guò)100個(gè)。十余年來(lái),累計(jì)有10萬(wàn)余個(gè)人通過(guò)平臺(tái)孵化成長(zhǎng)為公司,超過(guò)100萬(wàn)人通過(guò)平臺(tái)實(shí)現(xiàn)靈活就業(yè),千萬(wàn)企業(yè)通過(guò)平臺(tái)解決專業(yè)服務(wù)需求;專業(yè)性值得選擇。
小程序開發(fā)過(guò)程中遇到的問(wèn)題的介紹就聊到這里吧,感謝你花時(shí)間閱讀本站內(nèi)容,更多關(guān)于關(guān)于小程序開發(fā)的問(wèn)題、小程序開發(fā)過(guò)程中遇到的問(wèn)題的信息別忘了在本站進(jìn)行查找喔。