小程序開發(fā)遇到的問題(微信小程序開發(fā)過程中遇到的問題)
本篇文章給大家談談小程序開發(fā)遇到的問題,以及微信小程序開發(fā)過程中遇到的問題對應的知識點,希望對各位有所幫助,不要忘了收藏本站喔。
本文目錄一覽:
小程序開發(fā)的難點是什么?
小程序開發(fā)的難點有:如何通過技術手段提升開發(fā)效率以應對不斷增長的業(yè)務需求?微信小程序的工程化探索有哪些最新進展?如何實現(xiàn)小程序自動化構建、自動化測試?
如何將小程序開發(fā)與團隊現(xiàn)有的技術棧有機結合?如何適配 H5、React Native微信小程序等多端需求?如何擴展小程序的能力、滿足產(chǎn)品設計上的復雜需求?如何突破小程序包大小的限制?
如何解決頁面層級限制問題?在遇到長列表場景時,小程序渲染性能會出現(xiàn)瓶頸,如何進行性能優(yōu)化?由于微信小程序中缺少對 DOM 的控制,該如何滿足復雜交互需求?【點擊查看小程序開發(fā)底價】
想要了解更多有關小程序開發(fā)的相關信息,推薦咨詢豬八戒網(wǎng)。豬八戒網(wǎng)成立于2006年,是中國領先的企業(yè)服務平臺,服務交易獨角獸企業(yè)。豬八戒網(wǎng)現(xiàn)有注冊用戶2800萬、在全國布局線下數(shù)字化創(chuàng)業(yè)園區(qū)超過100個。十余年來,累計有10萬余個人通過平臺孵化成長為公司,超過100萬人通過平臺實現(xiàn)靈活就業(yè),千萬企業(yè)通過平臺解決專業(yè)服務需求;專業(yè)性值得選擇。
小程序開發(fā)經(jīng)驗總結
最近一直在做小程序,工作中也遇到了一些問題,踩了一些坑,所以想著寫篇文章記錄下來,并借此將小程序開發(fā)的相關知識進行梳理,方便以后參考,也為剛剛接觸小程序的人提供一些思路方法,互相學習,共同進步。
1、微信小程序的目錄結構及配置說明
app.json是小程序的全局配置文件,所有配置項key必須使用 雙引號括起來 ,value值為字符串類型的也必須使用雙引號, 不支持單引號 。
1.1 pages
pages選項是必須配置的。該配置項注冊了小程序所有頁面的地址,其中每一項都是頁面的 路徑+文件名 。每一個頁面都是由.json、.js、.wxml、.wxss四個文件組成,并且 四個文件的名字必須要一致 。
1.2 ? tabBar
tabBar 配置項指定 tab 欄的表現(xiàn),以及 tab 切換時顯示的對應頁面。其中 list 接受一個數(shù)組,只能配置最少 2 個、最多 5 個 tab
1.3?usingComponents
使用自定義組件或者插件提供的組件前,必須先在這里聲明
2、開發(fā)微信小程序遇到的問題及解決辦法
2.1 雙向綁定
微信小程序不支持通過v-model的方式實現(xiàn)自動雙向綁定,需要給表單元素通過綁定事件,并使用this.setData來賦值實現(xiàn)。
2.2 computed和watch
微信小程序默認是不支持computed和watch的,如需要使用這兩項功能,需要安裝miniprogram-computed ,安裝方法見 官方文檔
2.3 對象賦值
如果給對象的屬性賦值,可以使用this.setData({'obj.key':value})來賦值,但是如果給某個屬性名是變量的屬性賦值,通過這種方法是會報錯的,經(jīng)過多次嘗試,發(fā)現(xiàn)使用如下的方式賦值成功。
let newObj = `obj.${key}`
this.setData({
[newObj]: value
})
2.4 scroll-view
當頁面存在彈框容器,并且彈框里的內容是需要滾動條滾動展示時,如果彈框下面那層的容器使用view元素的話,會導致滾動彈框內容時,同時會觸發(fā)彈框下面那層的頁面容器也會一起滾動,解決此問題可以將彈框下面的容器使用scroll-view元素替代view元素
3、小程序測試和發(fā)布
由于服務器域名request合法域名每個月 只能修改5次 ,因此在本地開發(fā)小程序時,需要在微信調試工具中設置不校驗合法域名。等小程序上線前再一次性將所有域名添加到小程序管理后臺。
以上便是此次小程序開發(fā)中積累的一些經(jīng)驗,希望能給剛剛接觸小程序的人提供一些思路方法,在以后的開發(fā)中,如果遇到新的問題,繼續(xù)更新文檔......
微信小程序開發(fā)中遇到的坑及解決辦法
taro單獨為某個項目切換taro版本環(huán)境
單獨為某一個項目升級#這樣做的好處是全局的 Taro 版本還是 1.x 的,多個項目間的依賴不沖突,其余項目依然可以用舊版本開發(fā)。 如果你的項目里沒有安裝 Taro CLI,你需要先裝一個:
# 如果你使用 NPM
$ npm install --save-dev @tarojs/cli@2.x
# 如果你使用 Yarn
$ yarn add -D @tarojs/cli@2.x
echarts在小程序中滑動卡頓
由于微信小程序中,echarts的層級最高,無論設置多大層級也無法遮住echarts。而且小程序中好像只能用echarts吧。所以為了解決這個bug,我只能委屈求全了。打開ec-canvas.wxml文件,將touchStart、touchMove和touchEnd去掉了,直接刪除就好啦。這三個事件應該是做縮放的吧,我們也沒有這個縮放的需求。所以就去掉了。雖然暫時滿足的需求,還是沒有真正的解決問題。
原:
bindinit="init"
bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}"
bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}"
bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"
現(xiàn):
bindinit="init"
echarts在小程序中無法跟隨頁面滑動
在卡頓問題中能與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('轉換圖片失敗', 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ā)遇到的問題的介紹就聊到這里吧,感謝你花時間閱讀本站內容,更多關于微信小程序開發(fā)過程中遇到的問題、小程序開發(fā)遇到的問題的信息別忘了在本站進行查找喔。