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:

1. 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"
  }

}

2. 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:

• 中文
• en-US

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.

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.