Skip to content

title是否要默认添加到Menu Item上 #1804

Closed
@youluna

Description

@youluna

现状

title已经添加到了Menu Item上,用户hover上去3s之后能看到所有被折叠的文字,屏幕阅读器也可以朗读
image
image

添加的原因

  1. 自动支持无障碍,方便屏幕阅读器朗读
  2. 超长折叠的文字可以hover显示

想去掉的理由

  1. 当title与innerText完全一样时,违反了WCAG “不要出现重复性文本” 的原则
  2. title的出现影响了一部分业务用户,他们不想要title提示框出现在页面上

方案

方案一

把title 改成aria-label,对innerText是非纯文本的节点再添加aria-label

缺点:

  1. 完全不会出现title,对于有“超长折叠的文字”的用户来说,需要针对每一项单独设置title="xxxx" 才能正常使用
  2. 屏幕阅读器会只读取aria-label 不再读取dom节点上的内容

方案二

提供ConfigProvider上的API showTitle,当值为true时,才设置Menu(包括Select/Cascader/CascaderSelect/Transfer/MenuButton等)的title属性。

缺点:ConfigProvider上的API都是功能型的API,showTitle不适合放

方案三

  • 对于Menu.Item的children是个纯string的情况:自动设置title,来解决图2超长...内容仍可见的需求
  • 对于自定义Menu.Item的情况(Menu.Item 的children不是纯string):不设置title,来解决可能出现的双气泡hover问题
    image

缺点:Menu.Item自动设置title的条件比较严苛,一些用户比如有在Menu.Item上添加Icon及文案,超长折叠的内容仍不可见

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions