總結小程式開發中遇到的問題

問題總結：
(1) 分隔線高度使用rpx問題
在相鄰的兩個訊息直接都會有一個分割線，將線的高度都設定成1rpx,在第一條和第二條之前的分隔線沒有顯示，但是其他的都展示了，分割線的屬性是一樣的，而且在不同的手機上（分辨率不同）不顯示的分割線也是不同的，有的分辨率好幾條分割線都不顯示，不知道這是模擬器的bug還是rpx的bug。解決方法：分割線的高度尺寸單位使用了px,解決了這個問題。

(2) Page註冊問題
這個錯誤可能很容易理解，頁面註冊錯誤。頁面是透過Page物件來渲染的，每個頁面對應的js檔案必須要建立page，最簡單的方式就是在js檔案下寫入Page({})，在page有管理頁面渲染的生命週期，以及資料處理，事件都在這裡完成。這個錯誤造成的原因一般都是剛創建頁面，js檔案還有有處理或忘了處理。
解決方法：養成創建頁面的同時在js檔案先創建Page的習慣.

(3) Page route 錯誤
重複調用路由引起的，處理方法就是刪除一個路由，刪除組件或刪除wx.navigateTo。

(4) Don't have * Handle in current page.
其實這種問題出現一般就是我們在wxml定義了一些處理事件，但是在js檔案中沒有實作這個時事件的處理方法，就會出現這個錯誤。那我們按提示在js檔案加上事件處理
解決方法：不要遺漏任何呼叫事件的方法實作

(5) tabBar 設定不顯示
對於tabBar不顯示，原因有很多，查找這個錯誤直接去app.json這個檔案

未將頁面註冊到app.json中

tabBar寫法錯誤導致的不顯示，將其中的大寫字母B寫成小寫，導致tabBar不顯示

tabBar的list中沒有寫入pagePath字段，或是pagePath中的頁面沒有註冊

tabBar的list的pagePath指定的頁面沒有寫在註冊頁面第一個。微信小程式的邏輯是」pages」中的第一個頁面是首頁，也就是程式啟動後第一個顯示的頁面，如果tabBar的list的pagePath指定的頁面都不是pages的第一個，當然也就不會顯示tabBar了。

tabBar的數量低於兩項或高於五項，微信官方中明確規定tabBar的至少兩項最多五項。超過或少於都不會顯示tabBar。

(6) wx.navigateTo 無法開啟頁面
一個應用程式同時只能開啟5個頁面，當已經開啟了5個頁面之後，wx.navigateTo無法正常開啟新頁面。請避免多層級的互動方式，或使用wx.redirectTo

(7) 本機資源無法透過css取得
background-image：可以使用網頁圖片，或是base64，或是使用

(8) 頁面資料傳遞
微信小程式路由（頁面跳轉）是透過API wx.navigateTo或wxml中元件實現的，不管哪種實作都會有一個重要的參數就是url，它指定了要跳轉的頁面，並且頁面之間資料傳遞也是透過url來實現的，這個資料傳遞有點類似於我們使用的get網路請求，把參數都拼接在要跳轉介面位址的後面並以“？”連接。然後將要傳入的資料以鍵和值的形式追加在”?”後面，多個參數直接用”&”符合。可以這樣寫

<navigator url="/pages/dynamic/dynamic?title={{item.title}}&message={{item.message}}">
<view class="item" >
<view class="item-left">
<image src="{{item.url}}" class="image"/>
</view>
<view class="item-middle">
<view>
<text class="title">{{item.title}}</text>
</view>
<view>
<text class="message">{{item.message}}</text>
</view>
</view>
<view class="item_right">
<view><text class="time">{{item.time}}</text></view>
<view class="mark" wx:if="{{item.count>0}}"><text class="text">{{item.count}}</text></view>
</view>
</view>
<view class="line"></view>
</navigator>

而資料接收是在js檔案的page裡接收的，page生命週期有一個onLoad函數，它就是做一些初始化資料的工作，onLoad函數有一個參數options，我們就可以透過key將資料獲取，如下

onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
console.log(options.title) //这里是接收参数
console.log(options.message)
},

這樣就實現了頁間資料傳遞功能。

以上是總結小程式開發中遇到的問題的詳細內容。更多資訊請關注PHP中文網其他相關文章！