Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[comp: popover]: add component popover #193

Closed
1 task done
LaamGinghong opened this issue Feb 5, 2021 · 13 comments · Fixed by #261
Closed
1 task done

[comp: popover]: add component popover #193

LaamGinghong opened this issue Feb 5, 2021 · 13 comments · Fixed by #261
Assignees
Labels
enhancement New feature or request
Milestone

Comments

@LaamGinghong
Copy link
Contributor

LaamGinghong commented Feb 5, 2021

Popover API

  • I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

弹出浮层显示更详细的信息,又避免使用弹窗这种直接影响用户操作的重量级视图。

What does the proposed API look like?

  • 可以手动控制浮层显隐,并有回调;
  • 浮层可以选择是否显示标题,并且标题允许用户通过传插槽的形式进行自定义;
  • 浮层一定会有内容;
  • 浮层可以根据用户配置选择定位对齐位置,并且可以由调用方决定是否需要自动定位;
  • 浮层支持多种触发方式;
  • 浮层可以由调用方决定是否需要在隐藏时销毁。

何时使用

需要展示一些详细信息,但又不想被弹窗打断当前其他操作。

API

ix-overlay

Props

名称 说明 类型 默认值 全局配置 备注
title 浮层的标题 string | v-slot:title - - -
content 浮层内容 string | v-slot:default - - 必传
placement 浮层的对齐方式 Placement top -
visible 是否显隐 boolean false - -
trigger 浮层触发方式 OverlayTrigger click -
showDelay 浮层显示延时 number 100 -
hideDelay 浮层隐藏延时 number 100 -
destroyOnHide 隐藏时是否销毁浮层 boolean false -
autoAdjust 浮层被遮挡时自动调整位置 boolean true -

Emits

名称 说明 类型
visibleChange 浮层显示隐藏回调 (visible: boolean) => void
@LaamGinghong LaamGinghong added the enhancement New feature or request label Feb 5, 2021
@LaamGinghong LaamGinghong added this to the v1.0.0 milestone Feb 5, 2021
@LaamGinghong
Copy link
Contributor Author

@danranVm 请review

@huangtenghui
Copy link

trigger这个配置不应该是全局的,浮层的触发方式应该是根据业务来决定

@LaamGinghong
Copy link
Contributor Author

trigger这个配置不应该是全局的,浮层的触发方式应该是根据业务来决定

其实只是想给调用方提供一个可以选择的能力,也许某些平台是更倾向于hover的方式显示浮层,某些平台更倾向于click显示浮层

@huangtenghui
Copy link

trigger这个配置不应该是全局的,浮层的触发方式应该是根据业务来决定

其实只是想给调用方提供一个可以选择的能力,也许某些平台是更倾向于hover的方式显示浮层,某些平台更倾向于click显示浮层

不是的,用click还是用hover是根据业务来的,比如有些popover的内容是要靠后台请求得来的,那这时候会使用click,有些是一次性提前全部返回的,那么用hover;

@huangtenghui
Copy link

huangtenghui commented Feb 6, 2021

autoAdjustPopover这个应该不会有false的场景,悬浮的可视无遮挡应该是基本要求;

@LaamGinghong
Copy link
Contributor Author

LaamGinghong commented Feb 6, 2021

trigger这个配置不应该是全局的,浮层的触发方式应该是根据业务来决定

其实只是想给调用方提供一个可以选择的能力,也许某些平台是更倾向于hover的方式显示浮层,某些平台更倾向于click显示浮层

不是的,用click还是用hover是根据业务来的,比如有些popover的内容是要靠后台请求得来的,那这时候会使用click,有些是一次性提前全部返回的,那么用hover;

组件本身是可以自己修改props来自己选择哪种方式,并不是说全局配置就不能修改的,优先级是props大于全局配置的
image

@LaamGinghong
Copy link
Contributor Author

autoAdjustPopover这个应该不会有false的场景,悬浮的可视无遮挡应该是基本要求;

表格、长列表、虚拟滚动的场景可能会不需要这个

@danranVm
Copy link
Member

danranVm commented Feb 6, 2021

  • destroyPopoverOnHide => destroyOnHide
  • autoAdjustPopover => autoAdjust

这两个 API Tooltip、Popconfirm 应该也是可以共享的,命名上精简一些吧。
另外你的默认值要给出来,不然都不知道你的全局配置的默认值是啥。

@LaamGinghong
Copy link
Contributor Author

@huangtenghui @danranVm 更新了API

@danranVm
Copy link
Member

danranVm commented Feb 6, 2021

  • trigger 的默认值建议为 'hover'
  • destroyOnHide 的默认值建议为 false
  • showDelay 和 hideDelay 的默认值 500,是不是太长了点,我看 antd 都是 0.1s, 也就是我们的 100?

@LaamGinghong
Copy link
Contributor Author

  • trigger 的默认值建议为 'hover'

我觉得这种需要展示这么多详细信息的,更适合点击的场景,我目前做的这个需求就是这样。

@huangtenghui
Copy link

ok

@LaamGinghong
Copy link
Contributor Author

@danranVm 重新review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants