Mobile Platform as a Service:Hover

Styles

Currently, the following two hover styles are supported:

Examples

<text
  class="normal-text"
  value="06.hover + touchcancel"
  :hover="hoverDic"
></text>

data: {
    hoverDic: {
      backgroundColor: "#7b8b6f",
      color: "white"
    }
 }   

Precautions

When you use the hover property, note the following points:

• The does not support gesture movement to detect hover changes, that is, hover only supports click state changes.

• Upward pass-through is not supported. That is, leaf nodes respond to hover events first, and at most one node responds to hover events at the same time.

  For example, if both nodes A and B have the hover property and B is a child node of A, when B triggers a hover event, A no longer triggers a hover event.

• Follow the touch event blocking rules. That is, if a child node responds to a hover or touch event, the parent node no longer responds to the hover or touch event.

  For example, there are two nodes A and B, and B is a child node of A. If B responds to a hover event or a touch event, A no longer responds to a hover event or a touch event.

• Platform differences. Affected by platform differences in existing gesture capabilities, the response of a node with the hover property during animation (displacement animation) behaves differently on different platforms. The Android platform supports the hover response during the displacement animation track; the iOS platform does not support the hover response during the displacement animation track.