WeChat small program view container cover-view
May 18, 2021
WeChat Mini Program Development Document
Table of contents
cover-view
Base library 1.4.0 starts to be supported, and low versions need to be compatible.
A view of text that overlays on a native component.
Native components that can be covered
include map,
video,
canvas,
camera,
live-player,
live-pusher
Nested cover-view, cover-image only are supported, and button can be used in
cover-view.
The length units of component properties default to px, with 2.4.0 supporting incoming units (rpx/px).
Property
|
Type
|
The default
|
Required
|
Description
|
The lowest version
|
scroll-top
|
number/string
|
|
Whether
|
Set the top scroll offset, effective only after overflow-y: scroll becomes a scroll element
|
2.1.0
|
Tips
-
The
aria-role of cover-view and cover-image
can only be set to button, click in read-screen mode, and read out "buttons";
-
The base library 2.2.4 supports touch-related events, or you can use hover-class to set the click state
-
The base library 2.1.0 supports setting the css style of scale rotate, including transition animation
-
The base library from 1.9.90 cover-view supports overflow: scroll, but does not support dynamic updates to overflow
-
Base library 1.9.90 from the outerst cover-view support position: fixed
-
The base library from 1.9.0 supports inserting under labels such as view.
Previously, only native components could be nested within map, video, canvas, and camera, avoiding nesting within other components.
-
The base library 1.6.0 supports CSS Transition animation, Translation-property is only supporting Transform (Translatex, TranslateY) and Opacity.
-
The base bank 1.6.0 supports CSS Opacity.
-
The event model follows the bubbling model, but does not bubbling to the native components.
-
Text suggestions are labeled with cover-view to avoid typoography errors.
-
Only basic positioning, layout, and text styles are supported.
Setting up unilateral borders, background-image, shadow, overflow: visible, and so on is not supported.
-
It is recommended that child nodes do not overflow the parent node
-
The use of z-index control levels is supported
-
The default styles are: white-space: nowrap; l
ine-height: 1.2;
display: block;
-
When a custom component nests cover-view, the slot of the custom component and its parent nodes are not supported for the time being hidden through wx:if control, otherwise the cover-view does not appear