1、微信小程序的注冊和微信開發(fā)者工具的下載
在微信公眾平臺注冊小程序賬號，注冊時注意小程序和公眾號不能使用同一個帳號，登錄小程序時，公眾號會自動下線。一般賬號為郵箱號，所以提前準備倆郵箱號，方便注冊。注冊號一號進入如下界面：
可以完善小程序信息，以及實名認證等，這些都是傻瓜式的操作，懂漢語就行，不知道在哪里就多試試，試試又不懷孕！
然后下載你開發(fā)的工具：
下載完成后安裝即可。
2、創(chuàng)建項目
進入開發(fā)工具界面，新建開發(fā)項目：
這里會自動生成一些文件夾，下面是文件夾的具體說明：
pages:存放項目頁面文件,一般一個目錄對應一個頁面。
utils:存放工具函數（一般是自己封裝）。
app.js:全局的邏輯處理
app.json: (1)頁面文件路徑設置
(2)窗口外觀設置
(3)設置/添加tabbar(底部/頂部導航)
app.wxss:全局樣式
project.config.json:項目配置文件
sitemap.json:小程序內搜索，開發(fā)者可以通過 `sitemap.json` 配置，或者管理后臺頁面收錄開關來配置其小程 序頁面是否允許微信索引
小程序中.wxml對應的是html文件，.wxss對應的是css文件。
文件夾中文件組成：
home.js:邏輯處理
home.json:靜態(tài)數據
home.wxml:頁面結構
home.wxss:頁面布局
3、利用tabBar設置小程序的菜單導航
上面寫到設置、添加tabBar在app.json文件中，所以在此文件中設置需要的菜單導航，以及引入需要的圖標。這里可以將整個項目中用到的小圖標在阿里圖標庫中進行添加，跟vue項目中一樣，然后下載到本地，將對應的文件復制到項目文件中即可。
這里一般設置三個導航項，iconPath為默認未點擊時顯示的圖標路徑，selectedIconPath為選擇點擊后的圖片路徑。效果如下圖：
如果想讓導航位置位于整個頁面的上方，可以將tabBar中的position屬性設置為top即可。
這里拷貝一下微信官方文檔內容，供大家參考：
4、全局設置
backgroundTextStyle string dark——下拉 loading 的樣式，僅支持 dark / light
avigationBarBackgroundColor HexColor #000000——導航欄背景顏色，如 #000000
navigationBarTitleText string——導航欄標題文字內容
navigationBarTextStyle string white——導航欄標題顏色，僅支持 black / white
復制快捷鍵：
向下：Alt Shift 向下光標鍵
向上：Alt Shift 向上光標鍵
5、應用頭部布局
由于空間較小等，我們可能在“開發(fā)者工具”中開發(fā)不太習慣，這時我們可以在其他軟件中進行開發(fā)，如webstorm中，只需要安裝WeChat weapp Support插件。
如需要微信小程序中默認的小圖標：
用如下icon標簽引入即可（這里引入了搜素圖標）：
6、數據請求和頁面跳轉
在基本布局和樣式完成后，就是請求數據和渲染界面。
請求后臺api接口數據一般封裝一個工具函數，因為有很多頁面要請求數據。工具函數的封裝大概如下：
然后就是在頁面引入使用它：
接下來就是如下所示的一些數據渲染：
在一些頁面中要實現頁面間的跳轉，微信小程序中用bindtap，相當于綁定一個點擊事件，然后在對應的js文件中寫入需要跳轉的頁面路徑：
版權聲明：本文內容由互聯網用戶自發(fā)貢獻，該文觀點僅代表作者本人。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。如發(fā)現本站有涉嫌抄襲侵權/違法違規(guī)的內容， 請發(fā)送郵件至 舉報，一經查實，本站將立刻刪除。
