Wuss Weapp 一款高質量，組件齊全，高自定義的微信小程序 UI 組件庫

Wuss Weapp

一款高質量，組件齊全，高自定義的微信小程序 UI 組件庫

文檔

https://phonycode.github.io/wuss-weapp

掃碼體驗

使用微信掃一掃體驗小程序組件示例

演示圖片

快速上手

在開始使用 Wuss Weapp 以前，你須要先閱讀 微信小程序自定義組件 的相關文檔。

如何使用

方法一 [推薦] (經過npm安裝依賴並在小程序構建npm模塊)

1. 經過使用shell命令或git定位到當前小程序開發目錄，而後使用npm或者yarn安裝依賴。

npm install --production wuss-weapp

或者

yarn add --production wuss-weapp

1. 當依賴安裝完成後便可在微信小程序開發者工具裏點擊 [工具] => [構建npm]，此時若出現彈窗則記得吧 「使用npm模塊」 勾上，若無彈窗則待構建完成後在詳情裏面手動勾上 「使用npm模塊」。

2. 構建完成後便可添加須要的組件。在頁面的 json 中配置：

"usingComponents": {
  "w-button": "wuss-weapp/w-button/index"
}

1. 在 wxml 中使用組件：

<w-button type="info" bind:click="buttonClick">這是一個按鈕</w-button>

1. 在JavaScript中使用:

import { Alert, Toast } from 'wuss-weapp';

Alert({
  title: '提示',
  content: 'wuss weapp is good',
});

Toast.show({
  message: 'wuss小程序UI庫',
});

方法二(經過clone當前項目的dist拷貝到本身項目中使用)

1. 到 GitHub 下載 Wuss Weapp 的代碼，將 dist 目錄拷貝到本身的項目中。而後按照以下的方式使用組件，以 Button 爲例，其它組件在對應的文檔頁查看：

2. 添加須要的組件。在頁面的 json 中配置（路徑根據本身項目位置配置）：

"usingComponents": {
  "w-button": "/dist/w-button/index"
}

1. 在 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，感謝

LICENSE

MIT