什么是通用样式hover_移动开发平台 mPaaS(mPaaS)-阿里云帮助中心

蚂蚁动态卡片支持配置 hover 属性，通过 hover 属性配置节点样式。当手势点击具有 hover 配置的节点时，该节点显示 hover 属性配置的样式，当手势离开该节点时恢复原始样式。

样式

目前支持以下两个 hover 样式：

属性	值类型	默认值	写法	备注
background-color	色彩单位	0	background-color:red;	hover 发生时的背景色变化。
color	色彩单位	-	color:rgb(255,0,255);	hover 发生时的字体颜色变化。

示例

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

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

注意事项

使用 hover 属性时，需注意以下几点：

不支持手势移动检测 hover 变化，即 hover 仅支持点击状态变化。
不支持向上透传，即叶子节点优先响应 hover 事件，并且同时最多一个节点响应 hover 事件。
例如，A 和 B 两个节点都有 hover 属性，并且 B 是 A 的子节点，则当 B 触发 hover 事件时，A 不会再触发 hover 事件。
遵循 touch 事件拦截规则，即子节点如果响应 hover 或 touch 事件，则父节点不再响应 hover 或 touch 事件。
例如，A 和 B 两个节点，B 是 A 的子节点，如果 B 响应 hover 事件或 touch 事件，则 A 不再响应 hover 或 touch 事件。
平台差异。受现有手势能力的平台差异影响，具有 hover 属性的节点在动画过程中（位移动画）的响应在不同平台表现不同。Android 平台支持位移动画轨迹过程中的 hover 响应；iOS 平台不支持位移动画轨迹过程中的 hover 响应。

示例代码

单击此处 detailHover.zip 获取完整示例代码。