2022年8月12日 星期五

第一個小程式Hello World

1.      開啟「微信開發者工具」。

2.      選擇Mini Program(小程序),新增Mini Program

3.      系統會預設一個檔案名,亦同時會於本機內新增一個以這專案(project)命名的文件夾,貯放所有相關的檔案。Appid可輸入touristappid

4.      新增後完全開啟後大概會出現以下的畫面,預設會輸出Weixin這字句。

5.      主要的檔案位於pages\index文件夾內,分別有4個檔案。

(1)   Index.js  (JavaScript的文件)

(2)   Index.json  (是資料貯存格式的文件)

(3)   Index.wxml (是畫面內容的主文件,相當於網頁的html的文件)

(4)   Index.wxss (是美化畫面內容程序的文件,相當於網頁制作的CSS文件)

6.      新文件預設會輸出 Weixin這字句,這內容貯存於index.wxml內,如下:

7.      Weixin修改成Hello World! 暫時不用理會其他程序碼有甚麼用途。

8.      修改後並不會立即顯示的,要經過編繹(compile)才可以,按以下的Compile圖示便可以。

實際上有多種編繹方式的,現時選預設的Ordinary Compilation便可以。

9.      模擬器的畫面便會出現Hello World

10.  想試試index.wxml內其他語句的作用,試試刪掉index.wxml內所有文字,如下:

11.  然後祇輸入文字,例如hello hello world! (跟以上不同,以便查看有甚麼變化)再按Compile

12.  結果如下。並不影響文字的輸出,祇是影響文字的位置而已。那些語句是用來編排內容及設定格式的。之後的內容再學習如何處理。

13.  完成! 基本上已制作了第一個微信小程序(Mini Program)了。

 

相關文章:

1.      .

-          這是微信小程序的官方文件,內裡有完整的相關程序碼及說明。


第一個小程式Hello World

1.       開啟「微信開發者工具」。 2.       選擇 Mini Program( 小程序 ) ,新增 Mini Program 。 3.       系統會預設一個檔案名,亦同時會於本機內新增一個以這專案 (project) 命名的文件夾,貯放所...