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

Wave 采用更通用的方式来选取目标 #47956

Closed
martesi opened this issue Mar 19, 2024 · 4 comments
Closed

Wave 采用更通用的方式来选取目标 #47956

martesi opened this issue Mar 19, 2024 · 4 comments

Comments

@martesi
Copy link

martesi commented Mar 19, 2024

What problem does this feature solve?

当构建自定义交互组件式,为了与 antd 设计保持一致,开发者可能为自定义组件也添加 Wave 包裹以期产生同样的视觉效果。但当自定义组件包裹特定 antd 组件时,useWave 中会采用 TARGET_CLS 进行 antd 目标元素判断,此时动效会发生在非期望目标上。

What does the proposed API look like?

Wave 添加一个可选参数 target 用于指定动效目标:

  • string。CSS Selector,作为现有实现 querySelector 的参数,其返回值作为目标候选。
  • () => HTMLElement。一个返回 HTMLElement 的参数,其返回值作为目标候选。

Possible compatibility issue

之前采用 TARGET_CLS 来实现自定义目标的组件将需要进行重构。比较简单的方式就是将 TARGET_CLS 作为新的 target 参数传递给 Wave。

@afc163
Copy link
Member

afc163 commented Mar 19, 2024

Wave 目前不是对外正式可以使用的组件。你需要怎么使用它?

@martesi
Copy link
Author

martesi commented Mar 19, 2024

Wave 目前不是对外正式可以使用的组件。你需要怎么使用它?

image

我希望能点击 Radio 的包装组件时能像 Button 那样触发边框的动效,而不是单 Radio 那个圆点的效果。

@afc163
Copy link
Member

afc163 commented Mar 19, 2024

我意思是 Wave 并不是正式组件,你应该没办法使用它?所以添加可选参数也应该没什么意义

@martesi
Copy link
Author

martesi commented Mar 19, 2024

我意思是 Wave 并不是正式组件,你应该没办法使用它?所以添加可选参数也应该没什么意义

确实,我是直接从 es/_utils 里面直接导的。那只能不用了。

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

No branches or pull requests

2 participants