Wuss Weapp
一款高質量，組件齊全，高自定義的微信小程序 UI 組件庫
文檔
https://phonycode.github.io/wuss-weapp
掃碼體驗
使用微信掃一掃體驗小程序組件示例
演示圖片
快速上手
在開始使用 Wuss Weapp 之前，你需要先閱讀 微信小程序自定義組件 的相關文檔。
如何使用
方法一 [推薦] (通過npm安裝依賴並在小程序構建npm模塊)
- 通過使用shell命令或git定位到當前小程序開發目錄，然后使用npm或者yarn安裝依賴。
npm install --production wuss-weapp
或者
yarn add --production wuss-weapp
-
當依賴安裝完成后即可在微信小程序開發者工具里點擊 [工具] => [構建npm]，此時若出現彈窗則記得吧 “使用npm模塊” 勾上，若無彈窗則待構建完成后在詳情里面手動勾上 “使用npm模塊”。
-
構建完成后即可添加需要的組件。在頁面的 json 中配置：
"usingComponents": {
"w-button": "wuss-weapp/w-button/index"
}
- 在 wxml 中使用組件：
<w-button type="info" bind:click="buttonClick">這是一個按鈕</w-button>
- 在JavaScript中使用:
import { Alert, Toast } from 'wuss-weapp';
Alert({
title: '提示',
content: 'wuss weapp is good',
});
Toast.show({
message: 'wuss小程序UI庫',
});
方法二(通過clone當前項目的dist拷貝到自己項目中使用)
-
到 GitHub 下載 Wuss Weapp 的代碼，將
dist目錄拷貝到自己的項目中。然后按照如下的方式使用組件，以 Button 為例，其它組件在對應的文檔頁查看： -
添加需要的組件。在頁面的 json 中配置（路徑根據自己項目位置配置）：
"usingComponents": {
"w-button": "/dist/w-button/index"
}
- 在 wxml 中使用組件：
<w-button type="info" bind:click="buttonClick">這是一個按鈕</w-button>
預覽所有組件
我們內置了所有組件的示例，您可以掃描上方的的小程序碼體驗，或按以下方式在微信開發者工具中查看：
git clone https://github.com/phonycode/wuss-weapp.git
然后，直接將項目在微信開發者工具中打開即可。
Wuss Weapp 官方交流群
QQ 群號 787275772
貢獻
有任何意見或建議都歡迎提 issue，提 issue 之前請先閱讀是否已經有相關 issue 或者如果有相關但是已經關閉 issue 只是還未更新的版本，請不要在此 issue 下方回復，如果更新版本后依然存在 請提新出的 issue，感謝