Get started
Note: The mini-antui component library provided by Ant Design Mini is obsolete and has been replaced with the updated antd-mini library. For more information about the updated library, refer to the Get started guide.
This topic guides mini-program developers to install and use the mini-antui component library in mini-program projects.
Installation
Use the following sample code to install the dependency:
$ npm install mini-ali-ui --save
Procedures
To use the component, complete the following steps:
- Register the component in JSON file of the related page. For example, the title component registration is as below:
{
"usingComponents": {
"title": "mini-ali-ui/es/title/index"
}
}
If you install the rpx version of the extended component library, modify the component name during registration:
{
"usingComponents": {
"title": "mini-ali-ui-rpx/es/title/index"
}
}
- Call the component in the AXML file.
<title
hasLine="true"
iconURL="https://example.com/images/T1HHFgXXVeXXXXXXXX.png"
type="close"
onActionTap="titleClose"
>the internal title can be closed
</title>
Internationalization
The texts of all the components are translated. And the following languages are now supported:
Note:
The default language is Chinese.
Method
To enable internalization for mini programs, add the following key and value to the globalData
field in the app.js file.
key | value |
miniAliUiLang | ''、'en-US' |
If the miniAliUiLang
key is void or not defined, the default language will be Chinese.
Samples
Check the following sample:
App({
globalData: {
miniAliUiLang: 'en-US',
},
onLaunch() {},
});
Version upgrade
Upgrade UI component version by using the following command:
$ npm update mini-ali-ui --save
Note:
The latest version is 1.3.0.