操作反馈

您所在的位置:网站首页 slideviewer软件 操作反馈

操作反馈

2023-07-18 11:02| 来源: 网络整理| 查看: 265

滑动菜单 SlideView基础案例示例代码自定义阈值自动关闭与主动关闭滑动菜单属性(SlideView Attributes)滑动菜单事件 (SlideView Events)滑动菜单 SlideView

可通过滑动显示操作菜单。

基础案例

滑动菜单分为两个部分组成,一是在未滑动时看到的部分(如下图)

二是在滑动时可见的部分(如下图的操作菜单部分)。

两者都是通过添加 slot 子节点来完成的。

因为 SlideView 组件较之前的组件较为特殊,这里会做一个说明,以供参考。

注意事项

为保证 SlideView 正常显示,我们需要设置 SlideView的 height 和 width 属性。同时,我们需要传入两个slot 子节点,并且用 slot="right" 和 slot="left" 给子节点命名。(left 代表的是可见部分,right代表的是需要滑动时才可见的操作菜单部分)标有 slot="right"的子节点的宽度要与组件的 slide-width 属性值相等。 示例代码 购买运动器材 10-26 18:50 - $2499 喜欢 分享 删除

如下图:

自定义阈值

阈值是指当我们左滑或则右滑多少rpx时会触发 SlideView 开关的值。

SlideView 默认的阈值是 1/2 的操作菜单宽度,当然,为了不同宽度操作菜单能有更丝滑的体验,我们也提供自定义阈值,可以通过 threshold 属性来设置,单位是rpx。

自动关闭与主动关闭

我们除了滑动触发 SlideView 的关闭外,还可以通过另外两种方式来关闭它。

注意事项

设置 auto-close为 true 时, 我们点击了菜单栏部分,组件会自动关闭;设置 close 为 true 时,组件会主动关闭。 滑动菜单属性(SlideView Attributes)参数说明类型可选值默认值width组件显示区域的宽度,不包含菜单栏部分,单位rpxNumber750height组件显示区域的宽度,不包含菜单栏部分,单位rpxNumber100slide-width组件滑动显示区域(菜单栏)的宽度,单位rpxNumber0threshold触发组件菜单栏打开和关闭的阈值,单位rpxNumber菜单栏宽度/2disabled设置是否禁用Booleantrue/falsefalseauto-close设置点击菜单栏后是否自动关闭Booleantrue/falsefalseclose设置是否主动关闭菜单栏Booleantrue/falsefalse 滑动菜单事件 (SlideView Events)事件名称说明返回值备注bind:lintap点击菜单栏时触发click right-bind:slideopen菜单栏打开时触发true-bind:slideclose菜单栏关闭时触发false-


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3