aria-component

Barrier-free access

To better meet the access needs of visually impaired people for small programs, the base library supports some ARIA tags from 2.7.1.

The accessibility feature is accessible in read-screen mode, and iOS can be turned on via settings-universal-accessibility-and-narration.

In the case of view components, developers can add aria-role and aria-label properties. W here aria-role represents the role of the component, when set to 'img', the system reads out the 'image' when focused in read-screen mode. W hen set to 'button', the 'button' is read aloud after focusing. Aria-label represents the additional information that comes with the component and is read out automatically after focusing.

Small programs already have some barrier-free features built in, and for non-native components, developers can add the following barrier-free tags.

The sample code

<view aria-role="button"  aria-label="提交表单">提交</view>

Tips:

1. There will be differences between the different systems that read aloud after setting up aria-role in Android and iOS screen reading mode
2. The aria-role that can be set can be found in Widget Roles in Using Aria, and some of the roll settings may not work on the mobile side.