用戶
 找回密碼
 立即注冊

QQ登錄

只需一步,快速開始

掃一掃,登錄網站

小程序社區 首頁 教程 查看內容

玩玩微信小程序(多圖預警)

Rolan 2019-6-21 00:21

趁著最近下班比較早,還是有時間看下其他知識點。于是,自己屁顛屁顛的玩了下微信小程序。環境安裝我使用的是mac電腦來開發,那我簡單說下我自己的準備工作吧~首先,你需要一個良好的編輯器工具,我這里下載了subli ...

趁著最近下班比較早,還是有時間看下其他知識點。于是,自己屁顛屁顛的玩了下微信小程序

環境安裝

我使用的是 mac 電腦來開發,那我簡單說下我自己的準備工作吧~

首先,你需要一個良好的編輯器工具,我這里下載了 sublime、vscode和微信開發者工具 。我選擇使用 微信開發者工具 進行開發,因為對開發者友好。有說vscode比較友好的,需要配置些東西,這就要百度一下了。

然后,如果你的小程序要上線或需要使用里面比較完整的功能,你需要注冊一個微信小程序,獲取 appId 。我這里是學習而已,所以只是用微信提供的測試 appId ,這個測試 appId 在使用 微信開發者工具 新建項目的時候有得選擇。

嗯~就是這么簡單,驚喜不~意外不:hushed:

項目結構

當你使用 微信開發者工具 新建項目的時候,它會自動幫你新建一個規范的項目目錄結構。當然,我們也可以從零開始進行搭建啦。我下面簡單羅列下我項目中的結構(截止2019年06月21日):

- app.js
- app.json
- assets
  - tabbar
	- home_active.png
	- home.png
	- profile_active.png
	- profile.png
- pages
  - home
	- home.js
	- home.json
	- home.wxml
	- home.wxss
  - profile
	- profile.js
	- profile.json
	- profile.wxml
	- profile.wxss
- page.wxss
- project.config.json
- README.md
復制代碼

也許你已經注意到了文件后綴名 js, json, wxml, wxss 。那么它們具體是干什么用的呢?

js后綴名的文件是你寫 javascript 的地方了,項目的一些邏輯代碼。

json后綴名的文件是你寫頁面的配置的地方, app.json 是應用的整體配置, home.json 是 home 頁面的配置, profile.json 是 profile 頁面的配置。

wxml后綴名的文件是你寫頁面骨架的地方,類似我們的 html 。

wxss后綴名的文件是你寫頁面樣式的地方,類似我們的 css 。

練手項目

在看了文檔,百度了些資料,就開始想一個練手的項目 -- github信息展示 。

首先,我們搭建好項目的目錄,之后就是根據文檔啥的進行我們的項目構思的實現了。具體的過程我這里就不贅述了,畢竟在文章后面會配上項目代碼的github地址啦:dog:~

我們來看下效果吧:

鮮花
鮮花
雞蛋
雞蛋
分享至 : QQ空間
收藏
原作者: call_me_R 來自: 掘金
致青春APP