Quick learning
Before you can start using Wuss Eappp, you need to read the documentation for the app’s custom components.
Github address (if you like, you can click a star~)
Github
Wuss Weapp document
wuss-weapp docs
“Wuss Eappp
QQ group no. 787275772
Preview all components
We have built in examples of all the components, and you can scan the applet experience below
Or view it in the wechat Developer tool in the following ways:
git clone https://github.com/phonycode/wuss-weapp.git
Copy the code
Then, directly open the project in the wechat developer tool.
How to use
Method 1 [Recommended] (Install dependencies through NPM and build NPM modules in applets)
- Locate the current applets development directory using shell commands or git, and install dependencies using NPM or YARN.
npm init && npm install --save wuss-weapp --production
Copy the code
or
yarn init && yarn add --save wuss-weapp --production
Copy the code
-
When the dependency installation is complete, you can click in the wechat small program developer tool[Tools] => [Build NPM], remember if there is a popover“Using the NPM module”Check. If there is no popup window, manually check it in the details after the construction is completed“Using the NPM module”.
-
Once the build is complete, you can add the required components. Configure in JSON on the page:
"usingComponents": {
"w-button": "wuss-weapp/w-button/index",
"w-toast": "wuss-weapp/w-toast/index",
"w-alert": "wuss-weapp/w-alert/index"
}
Copy the code
- Using components in WXML:
<w-button type="info" bind:onClick="buttonClick">This is a button</w-button>
<w-toast id="wuss-toast" />
<w-alert id="wuss-alert" />
Copy the code
- Used in JavaScript:
import { Alert, Toast } from 'wuss-weapp';
Alert({
title: 'tip'.content: 'wuss weapp is good'}); Toast.show({message: 'Wuss Applets UI Library'});Copy the code
Method 2 (Clone the dist of the current project to use in your own project)
-
Go to GitHub to download the code for Wuss Syndrome and copy the Dist directory to your own project. Then use the component as follows, using Button as an example, and view the other components on the corresponding document page:
-
Add the required components. Configure in THE JSON of the page (the path is configured according to its project location) :
"usingComponents": {
"w-button": "/dist/w-button/index"
}
Copy the code
- Using components in WXML:
<w-button type="info" bind:onClick="buttonClick">This is a button</w-button>
Copy the code