Keyboard shortcuts

Press ← or → to navigate between chapters

Press ? to show this help

Press Esc to hide this help

view

视图容器

属性类型默认值必填说明最低版本
hover-classStringnone否指定按下去的样式类。当 hover-class="none" 时,没有点击态效果
hover-stop-propagationBooleanfalse否指定是否阻止本节点的祖先节点出现点击态
hover-start-timeNumber50否按住后多久出现点击态,单位毫秒
hover-stay-timeNumber400否手指松开后点击态保留时间,单位毫秒 

示例代码:

<!--pages/component/pages/view/view.mcml-->
<view>Hello MoreCross!</view>

<view class="hoverButton" hover-class="hoverClassOuter">我有点击效果</view>

<view class="hoverButton" hover-class="hoverClassOuter">
    我不会被内部view触发点击效果
    <view class="hoverButton" hover-class="hoverClassInner" hover-stop-propagation="{{true}}">我是内部view</view>
</view>
<view class="hoverButton" hover-class="hoverClassOuter">
    我会被内部view触发点击效果
    <view class="hoverButton" hover-class="hoverClassInner" hover-stop-propagation="{{false}}">我是内部view</view>
</view>
/*pages/component/pages/view/view.mcss*/
.hoverClassOuter{
  background-color: red;
  color:blue;
}
.hoverClassInner{
  background-color: green;
  color:white;
}
.hoverButton{
  margin: 20rpx 0;
}