電商模板說明

此模板為生鮮電商類型，主要功能包括商品列表展示、商品詳情查看、購物車、登錄注冊、個人中心、基礎設置等。通過此模板的使用能快速上手avm多端開發(fā)技術，并能在此模板基礎上快速開發(fā)出一套完整的生鮮電商類應用。 模板包含前后端，其中前端代碼使用avm.js多端技術(未處理)開發(fā)，可同時編譯為Android & iOS App以及微信小程序；后端使用APICloud數據云3.0（未處理）云函數自定義接口。

還有其他模板在此簡要介紹：

《點餐模板》（未處理），深度解析教程 此模板為一個餐飲商戶單商家堂食下單應用。主要功能包括瀏覽商家主頁信息、查看推薦菜品、下單商品、取餐等號等功能。使用avm.js多端技術開發(fā)和APICloud數據云3.0，可同時編譯為Android & iOS App以及微信小程序；

《企業(yè)模板》（未處理） 此模板是企業(yè)展示類型，主要功能包括企業(yè)信息展示、案例展示、加盟申請等。使用avm.js多端技術開發(fā)和APICloud數據云3.0，可同時編譯為Android & iOS App以及微信小程序；

《服飾商城》（未處理） 此模板是服飾商城，主要功能包括商品展示、商品搜索、購物車、訂單管理等。包含前后端，其中前端代碼使用 avm.js 多端技術開發(fā)，可同時編譯為 Android & iOS App 以及微信小程序；后端使用 APICloud 數據云 3.0 云函數自定義接口。

《教育培訓》（未處理） 此模板是一個教育培訓服務APP。提供在線瀏覽機構信息、名師風采和課程預約訂購等功能。 項目前端使用了avm.js 多端開發(fā)技術 ，可同時編譯為 Android & iOS App 以及微信小程序； 后端使用 APICloud 數據云3.0 云函數自定義接口。

效果圖

源碼目錄結構介紹

目錄結構延續(xù)widget代碼包的目錄結構，pages目錄下用于創(chuàng)建符合avm.js語法規(guī)范的stml文件，stml文件可用于編譯為App和小程序代碼。

|---widget             // widget代碼根目錄
|    |---components    // stml組件目錄。該目錄下stml文件僅被pages目錄下頁面引用，不單獨編譯
|    |---css           // 外置引用的css文件存放目錄
|    |---image         // 圖片資源文件目錄
|    |---pages         // stml頁面代碼文件目錄。該目錄中每個文件對應一個頁面，將被編譯為js或者小程序的3個代碼片段
|       |---about      // stml頁面代碼文件子目錄。如果您希望您的App能夠兼容微信小程序，需按照微信小程序目錄結構，新增一層子目錄，并將stml文件置于該目錄下
|    |---html          // 標準html頁面代碼文件目錄
|    |---res           // res目錄
|    |---script        // 外置引用的js文件存放目錄
|    |---config.xml    // app配置文件
|

使用步驟

1，下載最新版本的APICloud Studio 3

2，下載APICloud Studio 3，安裝后打開，頂部菜單選擇【項目】-【新建項目】，打開如下界面：

填寫應用名稱，選擇相應模板，點【完成】按鈕進行創(chuàng)建。

3，為當前項目編譯自定義Loader(未處理)進行真機同步調試預覽。或者手機安裝AppLoader（未處理），使用AppLoader進行真機同步調試預覽。WIFI同步使用教程 參考WiFi真機同步（未處理）。

4，小程序可通過studio3編譯項目后在微信開發(fā)者工具中進行預覽（未處理）。開發(fā)完成后可以將編譯的小程序包上傳到微信開放平臺，審核通過后，在微信中可以搜索查看。

5，云編譯 生成Android & iOS 應用安裝包以及微信小程序源碼包。編譯iOS之前需先上傳iOS證書，Android則可直接進行編譯。

技術支持

使用中若有任何疑問可到APICloud論壇AVM多端專區(qū)發(fā)帖提問。官方技術支持和眾多活躍開發(fā)者會第一時間為您提供技術支持。

項目地址

項目源碼git地址(https://www.apicloud.com/safe?fresh-ec)

注：如果需要快速使用這套模板的后端服務，請參考下邊的后端數據云服務使用教程。

電商模板后端數據云服務

針對該電商模板，我們?yōu)橛脩籼峁┝艘绘I導入的功能，用戶只需開通數據云，通過以下步驟即可擁有自己的服務器端代碼及數據。

1. 在該模板應用下開啟新版數據云3.0服務。

1. 在數據模型中可以看到預置模型，點擊生鮮配送，可以把該預置模型導入到自己的模型庫中

1. 在前端修改 script/kn.js中的x-apicloud-mcm-key以及baseUrl的地址為本appid數據云相關的地址。

a. x-apicloud-mcm-key：在云設置中的Secretkey中查看，如果數據云未開啟接口驗證設置，也可以不設置該字段。

b. baseUrl：在API調試頁面可以看到該應用的服務器地址，替換重新打包即可。

1. 數據云3.0會為您生成專屬的管理后臺，詳情請參考APICloud數據云3.0（未處理）

當電商的新版數據云3.0的模板庫引入到本項目后，開發(fā)者將擁有查看和修改相關代碼的權限，可以基于此進行二次開發(fā)以滿足您的業(yè)務需求。