只需 2 分鐘！帶你玩轉小程序新語言 WXS

WXS 是微信官方推出的一種腳本語言。引入 WXS 後，小程序開發者可以將數據處理代碼進行拆分，打造邏輯更靈活的小程序。

小程序開發者應該如何在小程序里，使用 WXS 呢？知曉程序（微信號 zxcx0101）今天就來一步步教你如何使用 WXS。

WXS 的語法是怎樣的？

WXS 的語法與 JavaScript 如出一轍，在 JS 中可用的語句，WXS 幾乎都可以支持。

例如，你可以在 WXML 中，寫如下代碼：

執行語句後，在小程序中它可以輸出「Hello World」；在調試控制台中，我們也可以看到「Hello」的提示語句出現。

某種程度上，我們也可以將 WXS 視作插入在 WXML 中的 JS 代碼，雖然二者在本質上是兩種語言。

需要注意的是，小程序中的 WXS 無法使用小程序的 API 介面，以及全局函數。WXS 只能讀取 JS 中的 ，並加以處理、使用。

同時，只有在 WXML 中使用 Mustache 語法（雙花括弧）引用 WXS 模塊中的內容，WXS 中的代碼才會載入、執行。

如何在小程序項目里開啟 WXS？

在最新版的「微信 Web 開發者工具 Beta」中，我們就已經可以開啟 WXS 功能了。

需要注意的是，普通的「微信 Web 開發者工具」是沒有 WXS 選項的。

關注「知曉程序」微信公眾號，回復「我要用工具」，查看「微信 Web 開發者工具 Beta」的下載地址。

在開發者工具中，我們可以這樣啟用 WXS：

進入需要啟用 WXS 功能的項目。

點擊開發者工具右上角的「項目」按鈕。

在「項目設置」中，勾選「使用 WXS」。

之後，我們就可以在項目中使用 WXS 了。

需要注意的是，無論用戶的微信版本是多少，你都可以直接啟用 WXS。

開發者工具在編譯、上傳代碼的時候，會自動將你的 WXS 代碼進行轉義，所以無需擔心兼容性問題。

如何使用 WXS？

微信為我們提供了兩個使用 WXS 方法：直接插入 WXS 代碼，以及引用 WXS 文件。

1. 直接插入 WXS 代碼

直接在 標籤里，插入 WXS 代碼。

2. 引用 WXS 文件

新建並編寫 WXS 文件後，在 WXML 的 WXS 標籤中，利用 屬性，引用相對位置的 WXS 文件。

需要注意的是，每一個 WXS 模塊，都需要用標籤進行命名。命名模塊後，開發者工具才能正常進行編譯、在 WXML 中引用模塊中的變數與函數。

另外，小程序的條件渲染和循環渲染對 WXS 是無效的。

也就是說，即使將 WXS 代碼包裹在未渲染的代碼中，只要渲染的 WXML 部分調用了此模塊，這段 WXS 代碼依然會被載入。

關於 WXS，我們就說到這裡，希望得知更多有關 WXS 的信息，可以查閱官方文檔。

關注「知曉程序」公眾號

點擊展開全文

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！