1背景

基于微信小程序的百度小程序也有類似的業務定位。依靠百度， 百度小程序這樣的老式搜索門戶，更傾向于搜索目的性很強的熱詞，這就是百度小程序和其他小程序的區別。

因此，我們在2018年底在百度開展了小項目開發。由于前期小程序開發經驗的積累，百度小程序的開發更加穩定和快速，不到一個月就投入運行。

2種應用場景

百度小程序入口：

三種詞條：百度APP搜索協會、百度郵政律師協會、其他百度生態搜索協會。

3.發展實戰

以下是百度，淘寶電影在小程序開發中遇到的坑和總結：

1)基礎開發

百度小程序的開發非常類似于微信和頭條小程序的開發方法和框架概念，屬于前端開發的一個子集，可以分為四個塊來構建百度小程序的頁面：

**篇：HTML。構建頁面框架：xxx.swan文件用于構建頁面元素框架，具有視圖、滾動視圖等獨特的HTML標簽。

第二：CSS。管理頁面樣式：使用xxx.css文件管理頁面樣式，支持大部分基本css樣式。

塊3: JS。寫頁面邏輯：使用xxx.js文件寫頁面邏輯，小程序有其獨特的生命周期管理方法。

第四塊：JSON。組件注冊：百度小程序支持通過組件構建頁面，并在xxx.json中注冊組件供頁面使用。

2)模板模板的使用

像其他小程序一樣，百度小程序也提供了模板的能力，可以提高工程和代碼的可維護性。開發人員可以在模板中設計代碼片段，向公開的接口中注入外部變量，然后在適當的時候使用代碼片段。

但是百度小程序在使用模板的時候，在傳輸數據的時候需要注意用{ { { { } }個三層花括號把對象包起來，否則在注入數據的時候會出現異常。

百度小程序模板的使用：

<template is="xxx" data="{{{item}}}"/>

相比之下，標題和微信小程序模板需要兩層花括號：

<template is="xxx" data="{{item}}"/>

3)組件屬性的觀察者用法當使用觀察者方法時，組件使用屬性的概率很高，當屬性改變時，將執行與屬性對應的觀察者方法。這里需要注意的是，在使用observer方法時要避免使用以下劃線開頭的方法名，這樣可能會導致observer方法的循環調用問題。

或者當發現屬性中的觀測器方法被循環，調用時，檢查觀測器綁定的方法是否有下劃線方法命名，去掉下劃線，可以大概率解決循環的調用問題。

會有一個觀察員循環打來電話：

i

isShowLoadMore: {         

   type: Boolean,         

   value: false,         

   observer: '_isshowChange'     

},

推薦的寫法：

isShowLoadMore: {         

   type: Boolean,         

   value: false,         

   observer: 'isshowChange'     

},

4）scroll-view 的使用

在使用 scroll-view 的開發過程中，對存在多個可滑動區域的頁面且其中一個滑動區域為 fixed 樣式時，iOS 機型會偶現 scroll-view 空白的問題。

可能存在異常的頁面布局如下:

<view class='頭部組件' style='position:fixed'/>

<scroll-view class='可滑動區域1' style='position:fixed' />

<view class='可滑動區域2' />

其中 “可滑動區域 2” 為依賴內容撐開的頁面 View，當內容到達一定長度時，頁面 View 會提供滑動能力。如果使用上述寫法可能會出現 scroll-view 空白的問題。

推薦的寫法：

<view class='頭部組件' style='position:fixed'/>

<scroll-view class='可滑動區域1' style='position:fixed;height:44px' />

<scroll-view class='可滑動區域2' style='height:80vh' />

A) DSL頁面登錄

首先授權小程序的登錄，獲取小程序的登錄證書，拿著登錄證書在自己的業務服務器上獲取小程序的真實登錄信息。開發人員完成上述過程后，將登錄信息加密并存儲在本地。DSL頁面的登錄過程在下次進行本地登錄信息的登錄驗證時完成。

B) WebView容器頁面登錄

由于百度小程序無法操作WebView容器的cookie信息，因此在登錄WebView容器頁面時，需要從服務器獲取登錄cookie。目前，在進入需要登錄驗證的WebView容器頁面之前，可以發起獲取cookie的服務器請求，服務器可以在處理完用戶登錄信息的驗證后，提供一個同步cookie的專門頁面。接口返回鏈接后，小程序的WebView容器需要做的就是訪問鏈接，將服務器返回的cookie同步到WebView容器，讓WebView容器有登錄信息進行驗證。

完成以上頁面的登錄操作后，小程序登錄過程結束。

4 百度小項目總結

本文重點介紹開發過程中會遇到的大概率的問題和解決方法，**和官方文檔一起查看。

*****是一家主營:煙臺小程序開發,煙臺網站制作,煙臺網頁制作,煙臺微信開發,煙臺app開發,煙臺網站建設,煙臺物聯網開發,煙臺網絡公司,煙臺網站制作公司,物聯網系統開發,煙臺app開發公司.歡迎來電咨詢！