小程序 【雲開發】 個完整流程Demo

1.新建小程序雲開發

 

2. 建立後 默認有示例，把pages下的文件都刪掉， 和app.json裏的頁面也相應去掉。 而後在pages下新建目錄 ，再新建Page 就能建立相應的js,wxss,wxml文件，並保存到app.json裏。

 

3.  建立本身的tab，  值得說的是app.json必須是嚴格的json格式,即要雙引號，不能多餘的, 號   

tab最多5個，最少2個

 

4.  小程序中引用第三方庫

安裝後，要在小程序裏構建下，工具》構建npm, 以後會多出個

而後 在界面的詳情裏 使用npm模塊，

修改 app.json

將 app.json 中的 "style": "v2" 去除，小程序的新版基礎組件強行加上了許多樣式，難以去除，不關閉將形成部分組件樣式混亂。

 引用組件

全局使用的就在app.json裏， 若是是單獨頁面的 就在頁面的.json裏引用如：

"usingComponents": {
 "van-button": "@vant/weapp/button" 
} ​​​​​​​

這樣就能愉快地引用vantui組件了。

==========  

在小程序端如何發起請求 ，

發起請求的方式一共有兩種，小程序端和雲函數。

一種是在小程序端發送請求，另外一種是咱們能夠在雲函數中發起請求。

若是在小程序 端發送請求，那麼小程序端中有一個 API函數叫作wx.request()，經過這個函數能夠經過小程序端直接向某一個服務端發起請求，在小程序端發起請求，請求回來的域名必定要通過ICP備案，才能去請求，不然的話是不能夠的，並且協議只支持https

若是咱們經過雲函數發起請求，那麼實際上是經過小程序的後端去發送請求。這個時候咱們能夠在小程序的雲函數當中去安裝第三方庫。好比說經常使用的request，got等均可以 發起請求，在雲函數端支持的協議是取決於第三方庫的。通常狀況下支持https/http都可以支持，那麼在雲函數端的請求他的限制是比較開放一些。能夠不通過備案，也能夠去發送請求。

經過第三方庫request發送請求

cloudfunctions做爲雲函數端，咱們要經過雲函數，首先咱們得先建立一個雲函數，在cloudfunctions下一級目錄。，同步下雲函數列表，

建立好了後，在movielist文件裏 使用終端打開，在終端中輸入第一條安裝request的命令，安裝完這個包後，就安裝request -promise這個包，可是得記住，必須得先按照request這個包，而後再安裝request-promise這個包。 

request-promise 文檔： https://github.com/request/request-promise
————————————————

安裝後就能看到 

如何經過request-promise去發送一個請求呢？固然也很簡單，咱們打開index.js文件，首先引入咱們的request-promise，

在index.js裏請求要的數據：

當咱們定義好雲函數後，咱們就在雲函數的文件上右鍵上傳並部署咱們的雲函數 。

咱們回到咱們的電影主界面，movie目錄，電機打開movies.js文件，在這個.js文件當中咱們須要作的是當加載電影這個 界面的時候，咱們就要去發送請求，也就是說，我須要去調用剛剛定義好的雲函數 ，在movies.js當中定義了不少生命週期函數，也就是鉤子函數。 這些鉤子函數是會當生命週期到達這個階段的時候會被自動的調用，那麼咱們直接在onLoad這個函數，這是一個監聽頁面加載函數，也就是頁面加載的時候會自動去加載這個onLoad函數，

而後咱們直接在onLoad裏面直接去調用咱們的雲函數 ，用cloud.callFunction()的方式去調用雲函數。

 

 

 

附：

黑馬API： http://www.liulongbin.top:3005/api/getlunbo

電影列表API：http://api.douban.com/v2/movie/in_theaters?apikey=0df993c66c0c636e29ecbb5344252a4a&start=0&count=10

電影詳情API：https://api.douban.com/v2/movie/subject/30261964?apikey=0df993c66c0c636e29ecbb5344252a4a

文章連接：https://blog.csdn.net/qq_37954086/article/details/88371416