商城系統(tǒng) 注冊(cè)

餐飲小程序系統(tǒng)開(kāi)發(fā)文檔

2018-03-27|HiShop
導(dǎo)讀:開(kāi)始項(xiàng)目: 在公眾平臺(tái)使用注冊(cè)的帳戶(hù)進(jìn)行登錄。然后,在主頁(yè)面左邊列表中點(diǎn)擊設(shè)置,再設(shè)置頁(yè)面中選開(kāi)發(fā)設(shè)置,就可以看到AppID。而AppID 可以用于在開(kāi)...

 餐飲小程序系統(tǒng)開(kāi)發(fā)文檔

  開(kāi)始項(xiàng)目:

  在公眾平臺(tái)使用注冊(cè)的帳戶(hù)進(jìn)行登錄。然后,在主頁(yè)面左邊列表中點(diǎn)擊設(shè)置,再設(shè)置頁(yè)面中選開(kāi)發(fā)設(shè)置,就可以看到AppID。而AppID 可以用于在開(kāi)發(fā)工具中進(jìn)行登記,使用開(kāi)發(fā)工具的高級(jí)功能。你可以到官網(wǎng)下載開(kāi)發(fā)工具。

  打開(kāi)開(kāi)發(fā)者工具,選擇小程序選項(xiàng),然后直接點(diǎn)擊「添加項(xiàng)目」按鈕。我們可以在這個(gè)步驟,填入剛才注冊(cè)的時(shí)候使用的AppID。如果項(xiàng)目目錄中的文件是個(gè)空文件夾,會(huì)提示是否創(chuàng)建 quick start 項(xiàng)目。選擇“是”,開(kāi)發(fā)者工具會(huì)幫助我們?cè)陂_(kāi)發(fā)目錄里生成一個(gè)簡(jiǎn)單的 Demo。這個(gè) Demo 擁有一個(gè)完整的小程序的大概框架。

  我們首先看一下官方提供的 Demo 含有的目錄:

  app.js:小程序邏輯、生命周期、全局變量。

  app.json:小程序公共設(shè)置、導(dǎo)航欄顏色等,不可以注釋。

  app.wxss:小程序公共樣式,類(lèi)似 CSS 。

  每一個(gè)小程序頁(yè)面是由同路徑下同名的四個(gè)不同后綴文件的組成,如:index.js、index.wxml、index.wxss、index.json

  微信小程序中的每一個(gè)頁(yè)面的路徑和頁(yè)面文件名,都需要寫(xiě)在app.json的pages中,且pages數(shù)組中的第一個(gè)頁(yè)面是小程序的首頁(yè)。

  這四個(gè)文件按照功能可以分成三個(gè)部分:

  配置:json文件

  邏輯層:js文件

  視圖層:wxss.wxml文件

  在 iOS 上,小程序的邏輯代碼運(yùn)行于JavaScriptCore 中,而在Android上,這個(gè)任務(wù)則是交給 X5 內(nèi)核來(lái)完成。

  在開(kāi)發(fā)工具上,小程序的JavaScript代碼是運(yùn)行在 NW.js(Chrome內(nèi)核) 中。這也導(dǎo)致開(kāi)發(fā)工具上的效果跟實(shí)際效果有所出入。

  微信提供了許多組件,主要分為八種:

  這其中,包含了view、scroll-view、button、form等普通常用的組件,也提供了地圖mapcanvas

  組件主要屬于視圖層,通過(guò) WXML 來(lái)進(jìn)行結(jié)構(gòu)布局,類(lèi)似于HTML。樣式則通過(guò) WXSS 來(lái)定義和修改,它的語(yǔ)法和使用都近似 CSS。

  組件使用語(yǔ)法實(shí)例:

  小程序的API分別為:網(wǎng)絡(luò)、媒體、數(shù)據(jù)、位置、設(shè)備、界面、開(kāi)發(fā)接口。

  重要提示:

  小程序的網(wǎng)絡(luò)請(qǐng)求接口包含了HTTPS請(qǐng)求,支持上傳、下載、Socket,滿(mǎn)足開(kāi)發(fā)中所需要的網(wǎng)絡(luò)需求。這些 API 屬于邏輯層,寫(xiě)在 JS 邏輯文件中。就是說(shuō)所有小程序的網(wǎng)絡(luò)請(qǐng)求都是必須通過(guò)HTTPS加密才能通過(guò)微信審核,微信推薦的CA企業(yè)天威誠(chéng)信的所有SSL證書(shū)產(chǎn)品均能滿(mǎn)足微信小程序HTTPS加密的使用需求。

  使用實(shí)例:

  wx.getLocation({ type: 'wgs84', success: function(res) { var latitude = res.latitude var longitude = res.longitude var speed = res.speed var accuracy = res.accuracy } })

  其它API的使用方法可以到官方文檔 – API 查看

HiShop小程序工具提供多類(lèi)型商城/門(mén)店小程序制作,可視化編輯 1秒生成5步上線(xiàn)。通過(guò)拖拽、拼接模塊布局小程序商城頁(yè)面,所看即所得,只需要美工就能做出精美商城。
更多小程序開(kāi)發(fā)案例,盡在:http://westcoastpropertyservices.com/xiaocx/kaifa.html    

電話(huà)咨詢(xún) 預(yù)約演示 0元開(kāi)店