# aria-component
To meet the needs of visually impaired people for access to Mini Programs.
# ARIA
In order to meet the needs of visually impaired people to access the Mini Programs, the base library supports partial ARIA tags since 2.7.1.
Accessibility features are accessible in screen reading mode and iOS can be set up ->Universal ->Auxiliary functions ->The narrator opens.
with view Components, for example, developers can addaria-role
andaria-label
Property.
amongaria-role
Represents the role of the component, when set to 'img', the system will read out 'image' after focusing in screen reading mode. When set to 'on', the system reads out 'Button' after focusing.
aria-label
Represents additional information that comes with the component and is read out automatically when focused.
Mini Programs already have some accessibility features built in. For non-native components, developers can add the following accessibility labels.
aria-hidden | aria-role | aria-label | aria-checked | aria-disabled |
aria-describedby | aria-expanded | aria-haspopup | aria-selected | aria-required |
aria-orientation | Aria-valuemn | air-valuemax | air-valuenow | aria-readonly |
air-multiselectable | aria-controls | tabindex | air-labelledby | aria-orientation |
aria-modal | aria-live | aria-atomic | aria-relevant |
# sample code
<view aria-role="button" aria-label = "submit form">submit</view>
# Tips
- Settings in Android and iOS screen reading mode
aria-role
What you read after the reading will vary from system to system. - Settable
aria-role
See Using AirWidget Roles
Some of the roles settings may not be valid on the mobile side.